1

我正在尝试设置一个 API 网关来调用另一个将图像上传到 S3 的 lambda 函数。当我使用像 POSTMAN 这样的应用程序时，该功能运行良好，但是当我使用 React 运行浏览器时，我收到以下错误。

Access to fetch at 'https://.../upload' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

在我的 API Gateway 中，我对该方法进行了以下配置

Gateway Responses for UserUpload API: default 4XX (not checked), default 5XX (not checked)
Methods: post (checked), options (checked)
Access-Control-Allow-Methods: options, post
Access-Control-Allow-Headers: '*'
Access-Control-Allow-Origin: '*'

此 API 使用授权者，我使用的是 Auth0 提供的授权者，根本没有编辑代码。

我的授权人调用的函数返回如下响应（例如快乐路径）：

exports.handler = async (event) => {
  //do data checks and upload to s3
  return {
    headers: {
      "Content-Type": "application/json",
      "Access-Control-Allow-Methods": "*",
      "Access-Control-Allow-Origin": "*",
    },
    statusCode: 200,
    body: JSON.stringify({ message: "success" }),
  };

这是我第一次同时设置 lambda 函数、授权提供程序和 API 网关，所以我可能会遗漏一些明显的东西。我也尝试添加mode: no-cors到我的 fetch POST 请求中，但是它们仍然以非常相似的方式失败。

通过查看授权方的日志和上传图像的 lambda 函数，我可以看出，它们甚至没有被调用。因此，似乎 CORS 错误与 API 网关有关。

我在一些教程中看到，在他们的 aws 模板 yaml 文件中，他们添加了一个选项AddDefaultAuthorizerToCorsPreflight为False. 我在 API Gateway 控制台的任何地方都看不到这个。

更新：我已经在自定义授权器关闭的情况下测试了我的功能并且它可以工作。所以我知道 CORS 适用于 options 方法，以及 lambda 函数返回的请求。问题在于自定义授权人。

目前的流程是：

  1. 方法请求 - 身份验证：my-auth-0-authorizer
  2. 集成请求 - 类型：Lambda_proxy
  3. Lambda 函数
  4. 集成响应 - [灰色的代理集成无法配置为转换响应]
  5. 方法响应：HTTP 状态：代理（Access-Control-Allow-Origin在响应标头中）

为了让我的授权人尊重 CORS 配置，我需要做些什么不同的事情或进行更改？

更新：离开我的 API 网关一天后，成功的响应现在正在工作（使用上面提到的流程）。我不确定系统中是否存在故障或意外发生，但它现在正在工作。我仍然遇到 CORS 问题，但现在只有不好的反应。

自定义授权失败return context.fail("Unauthorized");，当这种情况发生时，我的浏览器会收到 CORS 错误。我是否必须为 4XX 响应设置特殊的网关响应？

4

0 回答 0