node.js - 带有 React 和 Node 的谷歌应用引擎 : Production setup

Question

我使用 React.js 和 Node.js+Express 创建一个网站。我使用 Google App Engine 和 Google Datastore 作为数据库。

在我的本地计算机上一切正常: React 前端能够访问 Node.js 提供的 API 链接。 Node 应用程序能够访问在云上运行的数据存储。 在本地计算机上，我使用代理连接 Node 的端口 8080，以便 React 能够访问 API 链接。 从 package.json 文件: "proxy": "http://localhost:8080/" 在 React 中，我使用 URL 进行 API 调用: axios.get('/api/XXX' 我在 Express 中使用 HTTP 服务器。

当我将代码部署到 Google App Engine 时，我不确定需要进行哪些更改才能使 React 应用程序能够访问 Node API 链接。 我需要在 Prod 中使用代理吗？如何从 App Engine 获取 SSL key 和证书并放入 Express 中？我应该立即切换到使用 HTTPS 还是仍然可以使用 HTTP，直到我调整其余构建 block 以使其协同工作？

当我尝试访问以下链接时: axios.get('https://my_custom_domain/api/XXX'

然后我的 React 应用程序无法访问任何 API 链接。在 Chrome 控制台中，我看到 React 返回 404 错误。

我使用自定义域，并且我看到 Google App Engine 显示我的域 SSL 安全性是“Google 管理、自动续订”。 在 Node 中我使用 HTTP 服务器。我想切换到使用 HTTPS，但我不明白如何从 App Engine 控制台获取私钥和​​证书并将其放入 Express 应用程序中。

有没有办法从 App Engine 控制台获取证书和私钥？或者我应该从其他方/公司购买新的 SSL 证书并在我的 Express 应用程序中使用它并将其上传到 App Engine 中？

这是我的 yaml 文件: (server.js 是我的 Node 应用程序)

runtime: nodejs8 handlers: - url: / static_files: build/index.html upload: build/index.html - url: / static_dir: build - url: /api/* script: server.js

404 错误与 HTTPS 相关。所以我也从HTTP服务器切换到了HTTPS服务器。但是，我必须在没有凭据的情况下启动 HTTPS 服务器，因为 Google App Engine 不允许我查看这些凭据。 这就是我所做的: var httpsServer = https.createServer(/*credentials,*/ app);

但是，我仍然遇到 404 错误:

> Failed to load https://www.XXXXX.XXX/api/v1/list: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://XXXXXXXXX.appspot.com' is therefore not allowed access. The response had HTTP status code 404.

>

我使用了CORS库 var cors = require('cors'); app.use(cors());

但是，它仍然没有帮助，我收到了跨源错误。

我还尝试在 App.Yaml 中引入以下行: http_headers: Access-Control-Allow-Origin: https://xxxxxx.appspot.com 然而，当我尝试部署代码时，gcloud app deploy gcloud 不喜欢这个 header ，即使它来自其官方文档:)我认为因为 API 被认为是动态处理程序，因此我无法向其中添加 http_headers。 gcloud控制台的错误是: 解析文件时发生错误:[/xxxxxx/app.yaml] 映射类型脚本存在意外属性“http_headers”。 在“/Users/xxxxxx/app.yaml”

所以我不确定如何解决跨域问题。

(我觉得很奇怪，没有网站解释如何在 PROD 中为 Google 应用引擎设置 React + Node/Express。这是一个非常典型的架构)

Answer 1

如果您使用的是 Google-managed SSL certificates 的自定义域，您应该能够自动向生产应用程序发出 HTTPS 请求，而无需自己处理任何 SSL key 。鉴于您在日志中看到 404，看来请求已正常到达您的应用程序，但未路由到所需的处理程序代码。

您的 app.yaml 配置存在一些问题:

1. 对于 Node.js App Engine 环境，handlers 键下条目的 script 键的唯一有效值app.yaml 文件的值为 auto (请参阅 this documentation )。此外，script 键是可选的。

2. - url:/api/* 应为 - url:/api/.* 请参阅 部分same documentation 中的 >url 键.

3. 由于 App Engine 尝试将传入请求与 处理程序 中的条目从头到尾进行匹配，并且带有 static_dir 的条目将匹配以 url 中的值开头的任何请求(请参阅 same documentation :“以此前缀开头的所有 URL 均由此处理程序处理，使用 URL 的部分在作为文件路径一部分的前缀之后”)，例如，对 /api/v1/list 的请求将匹配此处理程序:

- url: /
  static_dir: build

因此，App Engine 将尝试在应用代码中的 build/api/v1/list 处提供静态文件，但找不到此类文件，并返回 404 。您应该重新排序处理程序，以便以 /api 开头的请求首先找到 API 处理程序。

尝试这个更新的app.yaml:

runtime: nodejs8
handlers:
- url: /api/.*
  script: auto
- url: /
  static_files: build/index.html
  upload: build/index.html
- url: /
  static_dir: build