谷歌云函数快速入门答案

【问题标题】：Google Cloud Functions Quickstart谷歌云函数快速入门
【发布时间】：2018-11-09 22:02:29
【问题描述】：

我很难开始使用 Google Cloud 功能。具体来说，就是发出一个简单的 HTTP POST 请求。

云函数如下所示：

const express = require('express')
const errorhandler = require('errorhandler')
const logger = require('morgan')
const bodyParser = require('body-parser')
const cors = require('cors')

let app = express()

app.use(bodyParser.json())
app.use(logger('dev'))
app.use(errorhandler())
app.use(cors({origin: true}))

exports.helloWorld = (req, res) => {
  // Example input: {"message": "Hello!"}
  if (req.body.message === undefined) {
    // This is an error case, as "message" is required.
    res.status(400).send('No message defined!');
  } else {
    // Everything is okay.
    console.log(req.body.message);
    res.status(200).send('Success: ' + req.body.message);
  }
};

我正在从一个简单的表单 HTML 文件和一个看起来像这样的 JS 文件发出 HTTP 请求：

const sendMessage = () => {



    const input = {
        "message" : document.getElementById('message').value
    }


    fetch('https://google-cloud-url-endpoint', {
        method: 'POST',
        headers: { "Content-Type": "application/json"},
        body: JSON.stringify(input)
    }).then(function(response) {
        return response.json()
    }).then(function(data) {

    })
}

在 HTML 表单中输入消息后，控制台会显示：

选项https://https://google-cloud-url-endpoint 400 () index.html:1 无法加载https://google-cloud-url-endpoint：对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，Origin 'http://127.0.0.1:53922' 不允许访问。响应的 HTTP 状态代码为 400。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。 index.html:1 Uncaught (in promise) TypeError: Failed to fetch

在检查网络响应时，我看到：

没有定义消息！

所以据我了解，它发出请求并从函数中得到响应。我的问题是，为什么它没有成功地将“消息”发送到函数？

【问题讨论】：

更新：在这个名为 Postman 的应用程序上，我将请求设置为 POST，输入 URL，并定义 {"message":"Hello There!"} 并通过应用程序成功发布... ..我直接从应用程序复制代码并将其放入我的 js 文件中，它仍然说同样的话！

标签： javascript google-cloud-platform google-cloud-functions

【解决方案1】：

解决方案：

这是我的客户端 JS 代码：

function sendMessage() {

var message = document.getElementById('message').value

var data = JSON.stringify({
  "message": message
});

var xhr = new XMLHttpRequest();
xhr.withCredentials = true;

xhr.addEventListener("readystatechange", function () {
  if (this.readyState === 4) {
    console.log(this.responseText);
  }
});

xhr.open("POST", "https://us-central1-stripe- 
update.cloudfunctions.net/function-1");
xhr.setRequestHeader("Content-Type", "application/json");


xhr.send(data);
}

这是 Google Cloud Functions 代码：

exports.helloWorld = (req, res) => {
  // Example input: {"message": "Hello!"}

  //set JSON content type and CORS headers for the response
    res.header('Content-Type','application/json');
    res.header('Access-Control-Allow-Origin', 'http://localhost:8000');
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    res.header('Access-Control-Allow-Credentials', 'true');

    //respond to CORS preflight requests
    if (req.method == 'OPTIONS') {
        res.status(204).send('');
    }

  if (req.body.message === undefined) {
    // This is an error case, as "message" is required.
    res.status(400).send('No message defined!');
  } else {
    // Everything is okay.
    console.log(req.body.message);
    res.status(200).send('Success: ' + req.body.message);
  }
};

【讨论】：