javascript - 在 aws cloudfront 上部署一个 Angular 应用程序

Question

我有一个 laravel php 应用程序，它基本上是一个 api，用户将通过一个 Angular 单页应用程序访问它。目前，angular 应用程序包含在 public 文件夹中，但我想将其单独拆分，以便我可以通过 amazon cloudfront 部署它。

我找到了 this有关在 CloudFront 上托管静态网站的文章，其中解释了基础知识，但我找不到任何讨论 api 与您的 cdn 服务站点的命中。

我仍然希望能够拥有 3 个不同的环境，开发/暂存和生产，每个环境目前都有自己的弹性 beanstalk 托管实例和单独的数据库。我希望他们的地址分别是 dev.blah.com/staging.blah.com 和 blah.com 并且让 Angular 应用程序的每个版本都命中正确的后端等。

我希望能够以与我部署到弹性 beantalk 的方式类似的方式部署 Angular 应用程序，即 git push

我可以设置它以便不需要为每个环境修改 Angular 应用程序中的 api 端点吗？即开发版本点击 dev.blah.com/get/user/1 并且使用相同的来源分期点击 staging.blah.com/get/user/1？这会自动发生还是我需要采取特定措施才能实现？

这一切都可能吗？我不希望有一步一步的指导，只是寻找过程的大纲，并插入我在哪里可以找到资源来学习如何自己做这件事，因为我的搜索结果并不多

Answer 1

在 CloudFront 上，在您分配的“行为”选项卡中，您可以为每个源分配一个路径。例如，您可以指定将/* 请求重定向到包含静态资源的 S3 存储桶，但将/api/* 重定向到您的 api 后端。

至于 dev/staging/prod 环境，它们可能也是 3 种不同的发行版。它们可以指向相同或不同的来源。

参见“Whole Site Delivery with CloudFront”