如何通过 https 在生产环境中部署 React 应用程序？

Question

我有一个 React 应用程序，它使用包含以下内容的 .env.production 文件在 HTTPS 上完美运行：

HTTPS=true
SSL_CRT_FILE=/etc/ssl/certs/mycert.crt
SSL_KEY_FILE=/etc/ssl/private/mykey.key

package.json 文件包含：

"scripts": {
   "start": "env-cmd -f .env.production react-scripts start",
   "build:production": "env-cmd -f .env.production react-scripts build"
}

当我这样做时：

npm start

一切正常，我可以从任何地方通过 HTTPS 访问我的服务器。现在，这很有趣，现在我这样做了：

npm run build:production

这也很好用，我得到：

The build folder is ready to be deployed.
You may serve it with a static server:

serve -s build

现在，这是失败的：

1) 当我使用上面的serve 命令时，.env.production 文件中的环境变量没有被拾取！为什么？

2) 如果我手动传递环境变量，如下所示：

HTTPS=true SSL_CRT_FILE=/etc/ssl/certs/mycert.crt SSL_KEY_FILE=/etc/ssl/private/mykey.key PORT=8580 serve -s build

似乎只提取了 PORT 变量，但服务器现在运行在 HTTP 上。有什么想法吗？！

Answer 1

当您运行 npm start 时，会在后台为您启动一个开发服务器，该服务器配置为获取 SSL_CRT_FILE、SSL_KEY_FILE 和 HTTPS 环境变量自动。

serve 不会那样做，您需要使用这些 CLI 标志让它知道：

serve -s build --listen 8580 --ssl-cert "/etc/ssl/certs/mycert.crt" --ssl-key "/etc/ssl/private/mykey.key"

How to deploy a react app in production over https?