1

我有一个烧瓶应用程序通过 zappa 部署到 AWS Lambda。Zappa 创建了一个 AWS 休息端点，例如random_api_ID.execute-api.us-east-2.amazonaws.com/dev直接输入浏览器时可以完美运行。但是，当我使用 Cloudfront 将此端点关联到我的自定义域时dev.mywebsite.com，我在对存储在子文件夹中的任何资产的响应中收到 404 错误。原因是因为 Cloudfront 正在提供诸如

dev.mywebsite.com/dev/static/css/style.css

代替

dev.mywebsite.com/static/css/style.css

此外，这有效： random_api_ID.execute-api.us-east-2.amazonaws.com/dev/static/css/style.css

但这不会： random_api_ID.execute-api.us-east-2.amazonaws.com/static/css/style.css

所以，不知何故，我需要 Cloudfront 来关联random_api_ID.execute-api.us-east-2.amazonaws.com/dev而dev.mywebsite.com不是dev.mywebsite.com/dev.

我的 Cloudfront 发行版具有以下参数：

 Alternate Domain Name: dev.mywebsite.com 
 Origin Domain: random_api_ID.execute-api.us-east-2.amazonaws.com
 Origin Path: dev <-- this is the stage name

我尝试通过 AWS API Gateway 将自定义域映射到 zappa 生成的 AWS 休息端点；但是，该解决方案会生成一个我无法控制的私有 Cloudfront 域；我更喜欢涉及配置 Cloudfront 的解决方案。

提前致谢！

4

2 回答 2

0

您可以添加一个选项，stageName以使您的 URL 在没有它的情况下可访问。

参考：https ://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/distribution-web-values-specify.html#DownloadDistValuesOriginPath

转到您的CloudFront 的 Distribution，编辑Origin指向 API Gateway URL 的点。

  • 找到Origin path选项
  • 把你stageName放进去（我的例子是dev舞台）所以它应该是/dev（需要有/前缀）

CloudFront 源配置

然后单击保存更改并等待大约 5 分钟的部署。并尝试以您喜欢的方式访问它

https://<domainName>/<resourceName>
于 2021-10-09T08:58:55.060 回答
0

我找到了这篇文章并最终通过使用 Cloudfront Functions 解决了这个问题：

  1. 确保您有一个 Cloudfront 分配，它a)与您的 AWS API Gateway 终端节点关联，并且b)包含您的自定义域名。

  2. 在origin您的分配选项卡中，我输入了完整的 AWS API Gateway 端点。我的应用程序使用 Zappa 自动生成的端点，random_api_ID.execute-api.us-east-2.amazonaws.com/dev. 在字段中输入完整的端点origin domain应该会自动用 填充origin path字段\dev。

  3. 在 Cloudfront 导航窗格中，选择Functions然后单击Create function按钮。

  4. 输入函数名称，然后单击Create Function。

  5. 选中Build tab后，转到该Function Code部分并输入以下 Javascript：

    function handler(event) {
    var request = event.request;
    request.uri = request.uri.replace(/^\/[^/]*\//, "/"); 
    return request;
}

在此处输入图像描述

  1. 保存你的函数

  2. 通过单击Test选项卡并输入带有附加阶段名称的 url 来测试您的功能：

在此处输入图像描述

  1. 单击test function按钮。您应该在函数代码下方收到一条成功执行消息：

在此处输入图像描述

  1. 单击选项卡并通过单击按钮Publish发布您的函数。Publish function

  2. 在发布部分下，您需要将发布的函数关联到您的 Cloudfront 发行版。单击Add distribution按钮。

  3. 在新窗口中，选择一个分布并单击Add Association按钮。

在此处输入图像描述

  1. 等待 Cloudfront 完成部署您的发行版。完成后，在浏览器中检查您的自定义域并确保资产已成功加载。
于 2021-10-12T18:21:21.070 回答