React App Docker 部署 Express/PM2 与 Nginx答案

【问题标题】：React App Docker deployment Express/PM2 vs NginxReact App Docker 部署 Express/PM2 与 Nginx
【发布时间】：2020-08-17 17:44:55
【问题描述】：

我已经创建并构建（react-script build）一个简单的反应应用程序。我想通过 Docker 映像将它部署到我的 ubuntu 服务器，我正在寻求建议。使用 expressjs 和 pm2 为 react 应用程序提供服务更好还是通过 nginx 提供服务更有用？有什么优点和缺点？

非常感谢您的建议

【问题讨论】：

标签： reactjs docker express nginx deployment

【解决方案1】：

当您要部署 React 应用程序时，您通常使用 Webpack 之类的工具将其编译为一组静态文件。完成此操作后，通过 nginx 部署它会比 Express 服务器更小、更快，而且由于您没有涉及整个 Node 解释器，因此涉及的部分更少可能存在安全问题。

事实上，即使您的应用程序的其余部分都在容器中，将前端托管在外部的某个地方也是有益的（例如，如果您要部署到 AWS，则将构建的前端放入一个S3 存储桶）。这可以稍微简化部署机制，并且使用 Webpack 的文件哈希，您可以为最近没有重新加载页面的浏览器保留旧版本的代码。您可能仍然需要 nginx 代理（提供 /index.html 页面，代理后端服务），但当前端代码更改时，您不一定需要重新部署它。

基于 Express 的部署设置的唯一真正优势是能够在生产环境中实时重新加载您的代码。但是，这会带来很高的人为错误风险：意外输入错误并保存文件，最终用户会看到错误页面。我会避开这条路。

【讨论】：

谢谢，您能解释一下托管外部前端是什么意思吗？如果它们不在同一台服务器上，前端如何联系后端？我假设我需要一个公共可用的 API 端点？
无论如何，您都需要一个公共 API 端点：实际的前端代码在最终用户的浏览器中运行，无法直接与 Docker 网络通信。因此，一旦 Webpack 生成了一个捆绑的 .js 文件，唯一真正的问题是如何提供该文件。如果你有一个 Express 服务器，它可以向浏览器提供文件，但浏览器会调用 API 服务器，而不是 Express 服务器。