时间戳

首页 > 解决方案 > 如何使用包含多个来源的 AWS Cloudfront 处理 403 和 404 错误

amazon-web-services - 如何使用包含多个来源的 AWS Cloudfront 处理 403 和 404 错误

问题描述

我在 AWS 中有当前配置：

  1. S3 存储桶设置为我的前端的静态网站

  2. ELB，我的后端有一个 EC2 实例

  3. 具有两个来源、两种行为和两个自定义错误页面的 Cloudfront 分发

    • 起源：
      • S3 存储桶（静态网站）
      • dev-api.mydomain.com（下面提到的指向 ELB 的别名记录）
    • 行为：
      • "/api/*" 路由到 dev-api.mydomain.com
      • “*”路由到 S3
    • 错误页面（这部分对我的问题最重要）：
      • 403 使用 index.html 返回 200 响应（来自 S3）
      • 404 使用 index.html 返回 200 响应（来自 S3）

  4. 53 号公路：

    • 注册域名
    • dev.mydomain.com 指向云端分发
    • dev-api.mydomain.com 指向 ELB

如何区分从 S3 和后端服务器返回的 403 和 404 错误？

注意：我使用 react 路由器来处理静态网站中的所有路由，因此对 S3 的每个请求都会从 S3 返回 404，除非用户特别要求 /index.html 资源。

场景 1：当用户访问 dev.mydomain.com/logi（登录错误）时，我希望它会命中我的 S3 存储桶并返回 404，然后它将获取存储桶中的 index.html 文件。Cloudfront 将返回具有 200 OK 状态的 index.html 文件，我的应用程序将通过显示 404 页面来处理无效路由。

场景 2：当用户访问 dev.mydomain.com/login 时，它会访问我的 S3 存储桶，返回 404 并返回 index.html 文件。一旦我登陆登录页面，为了这个例子，我会向 dev.mydomain.com/api/non_existant_route 发起一个网络请求。我希望它会访问我的 API 服务器并返回 404，然后我的前端将通过显示有关 API 请求失败的错误消息来处理它。

然而，场景 2 中发生的情况是 404 从我的后端服务器返回到 Cloudfront，然后返回 index.html 文件（来自 S3）作为带有 200 状态代码的响应。

所以，我的问题是 - 是否可以将 Cloudfront 配置为根据发回错误代码的来源返回不同的错误页面？如果没有，我怎样才能完成为后端服务器返回正确的响应？

是否需要我重新设计我的 AWS 解决方案？

标签： amazon-web-servicesamazon-s3amazon-cloudfrontaws-elb

解决方案

通过从云端删除自定义错误响应，我能够解决 403 和 404 问题。

我在路由到我的 S3 存储桶的默认行为 (*) 上创建了 Lambda@Edge 函数。在 Origin Request 上，该函数会修改对 /login 等页面的请求，以改为从存储桶中返回 /index.html。

推荐阅读