我有一个 React + Webpack/Babel + Node/Express 应用程序,我想将它部署在 AWS 上。
我需要分别部署 React 和 Node/Express 吗?或者它们可以同时部署在一起吗?
最佳答案
1。如果您有两个不同的项目
例如一个 react single-page app和一个 Node/Express API。
一个。您可以分别部署两者
S3 上的 前端(React 应用程序)和 CloudFront (tutorial)
Elastic Beanstalk 上的 后端(Node API) (推荐)或 EC2
另一种选择是在 Elastic Beanstalk 上同时部署两个部分。或 EC2 .但是,您会错过在 S3 和 CloudFront 上托管的好处,即为您的用户提供更快的交付和更便宜的成本。在我看来,单独更新和部署 Web 应用程序的客户端和服务器端也更方便,更不容易出现意外错误。
单独部署的另一个好处:对于拥有不同前端和后端团队的组织,每个团队都可以更轻松地自行部署应用程序,而无需依赖另一个团队团队。
b.为什么选择 S3 + CloudFront 而不是单独使用 S3?
- 全部 the benefits of using a CDN
- 您自己的域名和一键免费 SSL 证书
- 重定向
4xx
错误(如果您的应用使用基于HTML5 History
的路由器,则必须这样做) - 缓存系统
-
http2
和http 到 https
重定向
c。如何处理 CORS?
您可以使用不同的子域,例如
api.domain.com
用于 Node/Express APIapp.domain.com
用于 React 应用程序
然后 enable CORS在 API 中:
app.get('/api', cors({ origin: 'https://app.domain.com' }), ...)
2。如果你有一个项目
例如一个包含一些 React View 的 Node 应用程序。
您必须在 Elastic Beanstalk 上部署整个应用程序或 EC2 .
注意:如果您有一个包含两个子项目的项目(即一个文件夹用于 React 应用程序,另一个文件夹用于 Node API),并且如果两个子项目在分开时仍然可以工作,那么您可以部署子项目分开(见答案的第一部分)。
3。在这两种情况下
运行您的Webpack build在部署 React 部分之前。您可以手动(在 AWS 上部署之前)或自动(在您的 CI/CD 系统中)执行此操作。如果您使用 create-react-app 引导您的应用程序(CRA),只需在项目根目录运行 yarn build
或 npm run build
并将“build”文件夹的内容上传到您的 S3 存储桶。
4。工具
- Official AWS S3 CLI - 使用高级
aws s3
命令管理 S3 存储桶和对象。 - Official AWS Elastic Beanstalk CLI - 使用
eb
命令管理和部署您的后端。 - S3-deploy - 用于将文件部署到 S3 的 CLI 实用程序。
5。如果不限于 AWS
我回答了 a related question不限于 AWS。
关于javascript - 如何将 React + NodeJS Express 应用程序部署到 AWS?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41250087/