如何为部署在Google app Engine node.js flex环境上的React应用强制使用https？

我想为部署在Google app Engine node.js灵活环境上的React应用程序强制进行https连接。我的React应用程序是使用创建的

npx create-react-app my-cool-app  

我有一个app.yaml放在项目根目录中。app.yaml包含以下内容：

env: flex
runtime: nodejs
service: frontend-staging

我在这里看到了使用npm头盔库的其他问题/答案。但我不明白这怎么适用于我的案子。谷歌应用引擎不是在使用nginx提供静态构建目录吗？这里没有Express服务器，只有前端代码。如果我只有前端代码，如何使用这个库设置http安全头？我是否需要在nginx和我的React产品之间放置一个Express app server

我还询问了谷歌支持部门关于修改nginx.conf文件的问题。但是，根据他们的说法，我必须使用SSH连接到实例中，并以这种方式修改文件。那么，如果一个实例上的负载增加，GAE自动触发另一个实例，会发生什么呢？现在，我必须以某种方式检测到它，并手动将SSH连接到该实例以修复nginx.conf文件？我认为这也是一个潜在的解决方案，但这似乎是一个糟糕的选择

---

注：我不认为这是一个重复。我特别想问的是如何使用nginx+Express+React+代码示例为GAE node.js flex环境实现头盔库，而不是更高级别的策略问题

我终于自己解决了这个问题。您需要创建一个express服务器，运行一个Thread构建，并为那些由Thread构建脚本从express服务器生成的静态文件提供服务。因此，我建议您这样配置目录结构：

appRoot 
    ->client
        ->create-react-app contents here 
    app.yaml 
    app.js 
    package.json 

请注意，此配置中有两个package.json。其中一个位于客户端文件夹中，在运行create react app时作为设置的一部分创建。另一个用于nodejs服务器应用程序，位于approt目录中。在app.js文件中，您将放置代码以服务于静态文件：

const express = require('express');
const helmet = require('helmet')
const app = express();
const port = process.env.PORT || 3000;

const sixtyDaysInSeconds = 5184000
app.use(helmet.hsts({
   maxAge: sixtyDaysInSeconds
}))

//Serve up all of our static assets 
app.use( express.static('client/build') );

//Make all incoming GET requests return the index.html in order to take advantage of the client side router
app.get('/*', function(req, res) {
res.sendFile(__dirname + '/client/build/index.html', function(err) {
    if (err) {
        res.status(500).send(err);
    }
   })
})

app.listen(port, () => console.log(`Example app listening on port ${port}!`));

确保通过运行将头盔库添加到依赖项中

yarn add helmet 

yarn add express 

当然，通过运行添加express

yarn add helmet 

yarn add express 

您的app.yaml需要具备的全部功能是：

env: flex
runtime: nodejs
service: frontend-staging

现在将你的应用部署到GAE，你应该为每个请求提供HSTS头。请注意，提供HSTS头不会立即将用户重定向到https。从Mozilla Developer Network，首次使用HTTPS访问您的站点并返回Strict Transport Security标头时，浏览器会记录此信息，以便将来尝试使用HTTP加载站点时将自动使用HTTPS

---

换句话说，您的用户必须尝试使用https访问站点至少一次，才能发送HSTS标头

有完全相同的问题。我在flex上有一个React应用程序，在flex上还有一个节点API服务器。要重定向到HTTPS比应该的要困难得多。。。不管怎样，下面是@RyanRebo，我今天从谷歌支持部门得到了回复，希望在几个工作日内能有一个小的hello world示例。如果之前没有人回答，我会把我的发现贴在这里。我在应用程序中处理它的运气为零，所以我通过负载平衡器来处理它。将有兴趣看看它是否适用于you@RyanRebo终于收到了谷歌的回复。基本上，你需要启动一个express应用程序服务器，并让它为你的React应用程序构建目录服务。我计划下周解决这个问题，一旦我能解决，我会在这里发布一个答案。整个布局大致如下：用户计算机->互联网->GAE负载平衡器->AE实例->nginx web服务器->express app server->静态文件。我不确定这是否100%准确，但它应该足够准确，以了解这里发生了什么，并完成工作；DR：在nginx和react之间插入一个express app server。使用express设置HSTS标题