我使用React.js和Node.js + Express创建一个网站。我将Google App Engine和Google数据存储区用于数据库。

在我的本地机器上一切正常:
React前端能够访问Node服务的API链接。 Node 应用程序能够访问在云上运行的数据存储。
在本地机器上,我使用Proxy到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?

当我尝试访问链接时: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: nodejs8handlers:- 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错误:





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

但是,它仍然无济于事,我得到了跨原点错误。

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

因此,我不确定如何解决跨域问题。

(我感到奇怪的是,没有网站可以解释如何在PROD中为Google App引擎设置React + Node/Express。这是一个非常典型的体系结构)

最佳答案

如果您将自定义域与Google-managed SSL certificates一起使用,则应该能够自动向生产应用发出HTTPS请求,而无需自己处理任何SSL key 。假设您在日志中看到404,看起来请求已正确到达您的应用程序,但未路由到所需的处理程序代码。
app.yaml配置存在一些问题:

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

2. - url: /api/*应该是- url: /api/.*参见same documentation中有关url键的部分。

3. ,因为App Engine尝试从头到尾将传入请求与handlers中的条目进行匹配,并且带有static_dir的条目将匹配以url中的值开头的任何请求(请参阅same documentation:“所有以该前缀开头的网址由该处理程序处理,使用前缀后的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

09-10 07:22
查看更多