如何解决我的 API Gateway API 的 CORS 错误?

2 分钟阅读
0

当我尝试调用我的 Amazon API Gateway API 时,出现了“No 'Access-Control-Allow-Origin' header is present on the requested resource”错误。我想解决这个错误和 API Gateway 的其他 CORS 错误。

简短描述

当服务器未返回 CORS 标准要求的 HTTP 标头时,就会发生跨源资源共享(CORS)错误。要解决 API Gateway REST APIHTTP API 的 CORS 错误,必须重新配置 API,满足 CORS 标准要求。

有关为 REST API 配置 CORS 的更多信息,请参阅为 REST API 资源启用 CORS。对于 HTTP API,请参阅为 HTTP API 配置 CORS

**注意:**CORS 必须在资源级别进行配置,并且可以使用 API Gateway 配置或后端集成(例如 AWS Lambda)进行配置。

解决方法

以下示例步骤说明的是如何处理 No ‘Access-Control-Allow-Origin’ header present CORS 错误。其实,您可以使用类似的步骤来处理所有 CORS 错误。例如: Method not supported under Access-Control-Allow-Methods header 错误和 No ‘Access-Control-Allow-Headers’ headers present 错误。

**注意:**任何以下原因都可能会导致 No 'Access-Control-Allow-Origin' header present 错误:

  • API 没有配置返回所需 CORS 标头的 OPTIONS 方法。
  • 另一种方法类型(例如 GETPUTPOST)未配置为返回所需的 CORS 标头。
  • 代理集成非代理集成的 API 未配置为返回所需的 CORS 标头。
  • (仅适用于私有 REST API)调用了错误的调用 URL,或者流量未路由到接口虚拟私有云(VPC)端点。

确认导致出现错误的原因

有两种方法可以确认 API Gateway 出现 CORS 错误的原因:

  • 在调用 API 时创建 HTTP 存档(HAR)文件。然后,通过检查 API 响应中返回的参数中的标头来确认文件中错误的原因。
    或者
  • 使用浏览器中的开发者工具检查失败 API 请求的请求和响应参数。

在出现错误的 API 资源上配置 CORS

对于 REST API

按照说明使用 API Gateway 控制台在资源上启用 CORS

对于 HTTP API

按照为 HTTP API 配置 CORS中的说明进行操作。

**重要事项:**如果您为 HTTP API 配置 CORS,则 API Gateway 会自动向预检 OPTIONS 请求发送响应。即使没有为您的 API 配置 OPTIONS 路由,也会发送此响应。对于 CORS 请求,API Gateway 会将配置的 CORS 标头添加到集成的响应中。

在您的 API 资源上配置 CORS 时,请确保执行以下操作:

  • 对于 **API 的“网关响应”, <api-name> **选择 DEFAULT 4XXDEFAULT 5XX 复选框。

**注意:**当您选择这些默认选项时,即使请求未到达端点,API Gateway 也会使用所需的 CORS 标头进行响应。例如,如果请求包含不正确的资源路径,API Gateway 仍会以 403“Missing Authentication Token”错误进行响应。

  • 对于方法,如果尚未选中 OPTIONS 方法,请选择该方法的复选框。此外,选择可用于 CORS 请求的所有其他方法的复选框。例如: GETPUTPOST

**注意:**如果 OPTIONS 方法尚不存在,则在 API Gateway 控制台中配置 CORS 会向该资源添加一个该方法。此操作还会为 OPTIONS 方法的 200 响应配置所需的 Access-Control-Allow-* 标头。如果您已经使用控制台配置了 CORS,则再次配置它会覆盖所有现有值。

配置您的 REST API 集成会返回所需的 CORS 标头

配置您的后端 AWS Lambda 函数HTTP 服务器在其响应中发送所需的 CORS 标头。请记住以下几点:

  • 允许的域必须作为列表包含在Access-Control-Allow-Origin 标头值中。
  • 对于代理集成,您无法在 API Gateway 中设置集成响应来修改 API 后端返回的响应参数。在代理集成中,API Gateway 将后端响应直接转发给客户端。
  • 如果您使用非代理集成,则必须在 API Gateway 中手动设置集成响应,才能返回所需的 CORS 标头。

**注意:**对于带非代理集成的 API,使用 API Gateway 控制台在资源上配置 CORS 会自动将所需的 CORS 标头添加到资源中。

(仅适用于私有 REST API)检查接口端点的私有 DNS 设置

对于私有 REST API,请确定是否在关联的接口 VPC 端点上激活了私有 DNS

如果私有 DNS 已激活

确保使用私有 DNS 名称从您的 Amazon Virtual Private Cloud(Amazon VPC)中调用您的私有 API

如果未激活私有 DNS

您必须手动将流量从调用 URL 路由到 VPC 端点的 IP 地址。

**注意:**无论是否激活私有 DNS,都必须使用以下调用 URL:

https://api-id.execute-api.region.amazonaws.com/stage-name

确保将 api-idregionstage-name 的值替换为 API 的必填值。有关更多信息,请参阅如何调用私有 API

**重要事项:**如果在未激活私有 DNS 的情况下配置 CORS,请记住以下限制:

  • 不能使用特定于端点的公有 DNS 名称从 Amazon VPC 内访问您的私有 API。
  • 不能使用 Host 标头选项,因为来自浏览器的请求不允许操作 Host 标头。
  • 不能使用 x-apigw-api-id 自定义标头,因为它会启动一个不包含标头的预检 OPTIONS 请求。使用 x-apigw-api-id 标头的 API 调用将不会到达您的 API。

相关信息

测试 CORS

使用 API Gateway 导入 API 在资源上启用 CORS