1.如果你有两个不同的项目
例如一个反应单页应用程序 https://en.wikipedia.org/wiki/Single-page_application和 Node/Express API。
A。您可以单独部署两者
-
the frontend(React 应用程序)上S3 https://aws.amazon.com/s3 and 云锋 https://aws.amazon.com/cloudfront (tutorial https://medium.com/@omgwtfmarc/deploying-create-react-app-to-s3-or-cloudfront-48dae4ce0af)
-
the backend(节点 API)上弹性豆茎 https://aws.amazon.com/elasticbeanstalk/(推荐)或EC2 https://aws.amazon.com/ec2
另一种选择是同时部署两个部分弹性豆茎 https://aws.amazon.com/elasticbeanstalk/ or EC2 https://aws.amazon.com/ec2。但是,您将错过在 S3 和 CloudFront 上托管的好处,即为您的用户提供更快的交付 and 更便宜的成本。在我看来,单独更新和部署 Web 应用程序的客户端和服务器端也更方便,并且更不容易出现意外错误。
单独部署的另一个好处:对于前端和后端拥有不同团队的组织来说,每个团队都可以更轻松地自行部署自己的应用程序而不依赖于其他团队。
b.为什么使用 S3 + CloudFront 而不是单独使用 S3?
- all 使用 CDN 的好处 https://stackoverflow.com/a/34330741/652669
- 一键点击您自己的域名和免费 SSL 证书
- 重定向开启
4xx
错误(如果您的应用程序使用HTML5 History
基于路由器)
- 缓存系统
-
http2 https://en.wikipedia.org/wiki/HTTP/2 and
http to https
重定向
C。如何处理CORS?
您可以使用不同的子域,例如
-
api.domain.com
对于 Node/Express API
-
app.domain.com
对于反应应用程序
Then 启用跨域资源共享 https://github.com/expressjs/cors在 API 中:
app.get('/api', cors({ origin: 'https://app.domain.com' }), ...)
2.如果你有一个单一的项目
例如一个包含一些 React 视图的 Node 应用程序。
您必须将整个应用程序部署在弹性豆茎 https://aws.amazon.com/elasticbeanstalk/ or EC2 https://aws.amazon.com/ec2.
注意:如果您有一个项目包含两个子项目(即一个用于 React 应用程序的文件夹和另一个用于 Node API 的文件夹),并且两个子项目在分离后仍然可以工作,那么您可以部署子项目单独项目(参见答案的第一部分)。
3. 在这两种情况下
运行你的Webpack 构建 https://webpack.js.org/guides在部署 React 部分之前。您可以手动(在 AWS 上部署之前)或自动(在您的CI https://en.wikipedia.org/wiki/Continuous_integration/CD https://en.wikipedia.org/wiki/Continuous_delivery系统)。如果您使用以下命令启动您的应用程序创建反应应用程序 https://github.com/facebook/create-react-app(CRA),跑吧yarn build
or npm run build
在项目的根目录下,并将“build”文件夹的内容上传到您的 S3 存储桶。
4. Tools
-
官方 AWS S3 CLI https://docs.aws.amazon.com/cli/latest/userguide/using-s3-commands.html- 使用高级管理 S3 存储桶和对象
aws s3
命令。
-
官方 AWS Elastic Beanstalk CLI https://docs.aws.amazon.com/elasticbeanstalk/latest/dg/eb-cli3.html- 使用管理和部署您的后端
eb
命令。
-
S3-部署 https://github.com/import-io/s3-deploy- 用于将文件部署到 S3 的 CLI 实用程序。
5.如果不限于AWS
我回答了一个相关的问题 https://stackoverflow.com/a/41252583/652669不限于AWS。