API 网关 HTTP API CORS答案

【问题标题】：API Gateway HTTP API CORSAPI 网关 HTTP API CORS
【发布时间】：2020-07-04 21:26:34
【问题描述】：

我正在使用新的 API Gateway HTTP，它可以在配置期间让您添加 CORS。所以我设置了 Access-Control-Allow-Origin Header 设置 *.

但是，当我使用 Postman 发出请求时，我看不到该标头，这导致我的 VueJS Axios 请求失败。

我之前使用了 Lambda 代理集成，并在我的 Lambda 中执行了以下操作

"headers": { 
            "Access-Control-Allow-Origin": "*" 
        }

然而，新的 HTTP API 似乎并没有实现 CORS。也许我错过了一些简单的东西。

--编辑--

所以我一直在寻找答案，并遇到了 Serverless 人员的博客文章，他们设置了以下内容

It’ll ensure following headers:

Access-Control-Allow-Origin: *
Access-Control-Allow-Headers:

Content-Type, X-Amz-Date, Authorization, X-Api-Key, X-Amz-Security-Token, X-Amz-User-Agent
Access-Control-Allow-Methods:

OPTIONS, and all the methods defined in your routes (GET, POST, etc.)

我已经尝试了这些并重新部署，但仍然只能获得标准标题

谢谢

【问题讨论】：

自添加 CORS 设置后您是否重新部署？
@ydaetskcoR 它被设置为 AutoDeploy，但以防万一这不起作用，我部署到一个新阶段并尝试了，但仍然没有标题
我试图复制您的问题，但无论如何都无法取出 CORS 标头。还尝试从浏览器控制台运行请求。我建议你向 AWS 开一张支持票。
@michaelbahr 似乎我的 AWS 账户无法创建技术支持工单。
我没有使用新的HTTP api。我对 Lambda 集成有不同的体验。我发现在 Options 请求中我需要 'access-control-allow-origin': "", 'access-control-allow-headers': "content-type", 'access-control-allow-methods' ：“获取、放置、发布、删除”。在其他请求上，只需 'access-control-allow-origin': "", 'access-control-allow-headers': "content-type"

标签： amazon-web-services api aws-lambda cors

【解决方案1】：

我的问题是我发送了这个标头：
Access-Control-Allow-Origin
Access-Control-Allow-Methods
访问控制允许凭据
来自网络请求，它与 Access-Control-Allow-Headers 混淆了。我删除了它们，现在很好。

要使用 AWS HTTP API 调试 CORS 问题，请尝试在 AWS 控制台的 CORS 配置的每个字段中放置一个 *，然后逐个重新配置每个字段。

【讨论】：

【解决方案2】：

tldr; x-api-key

经过一些搜索和反复试验，但我让 CORS 为 API Gateway HTTP API 工作。对于来自 jQuery ajax 调用的非常基本的 GET 请求，我必须这样做：

AWS 控制台 CORS 设置，需要 Access-Control-Allow-Headers: x-api-key

然后，在我的 ajax 调用中，我不得不发送一个虚拟的 x-api-key（我没有配置一个，所以不确定它为什么需要它。）：

$.ajax ({
        url: 'https://xxxxxxx.execute-api.us-east-1.amazonaws.com/prod/stuff/',
        crossDomain: true,
        method: 'GET',
        headers: {
              "accept": "application/json",
              "X-Api-Key":"blablablalla"
          },
        success:function(data){
            doStuff(data);
        },
        error: function(){
            alert('error');
        }
    })

根据您的情况，您可能需要额外的配置，但 x-api-key 是我将其缩小为最奇怪的未记录要求。

【讨论】：

【解决方案3】：

（这仅适用于 AWS HTTP api 网关/AWS api 网关 v2）。我遇到了同样的问题，最后我问了 AWS 支持。棘手的事情实际上是 CORS 在我们配置之后已经在工作，但是 我只是不知道如何测试它（它与 AWS REST API 不同），当测试我们需要指定Origin（应该和你的设置一样：Access-Control-Allow-Origin in cors，比如：http://example.com）和Request method。例如：

curl -v -X GET https://www.xxx.yy/foo/bar/  -H 'Origin:http://example.com' -H 'Access-Control-Request-Method: GET'

然后它将返回您在响应标头中设置的 CORS 标头： access-control-allow-origin、access-control-allow-methods、access-control-allow-headers 等。

我只是希望这可以为遇到类似问题的人节省时间。顺便说一句，我希望AWS可以将这种测试方式更新为官方文档（它不是很有用，但大多数人必须看到它才能找到真正的答案）： https://docs.aws.amazon.com/apigateway/latest/developerguide/http-api-cors.html

【讨论】：

【解决方案4】：

对于任何使用 HTTP API 和代理路由的人 ANY /{proxy+}

您需要明确定义路由方法才能使 CORS 正常工作。

希望这在AWS Docs for Configuring CORS for an HTTP API 中更明确

与 AWS Support 进行了 2 小时的通话，他们联系了一位提出此建议的高级 HTTP API 开发人员。

希望这篇文章可以为一些人节省一些时间和精力。

【讨论】：

我花了很多时间试图弄清楚这一点。希望这也能更清楚地记录下来。在这里节省大量时间。谢谢。

【解决方案5】：

如果您有 JWT 授权方并且您的路由接受任何请求，您的授权方将拒绝 OPTIONS 请求，因为它不包含授权/不记名令牌。要解决此问题，您需要明确将您的路由指向您需要的 HTTP 请求/方法。例如。发布

在这种情况下，您的授权方将忽略没有 JWT 的 OPTIONS 请求并继续执行所需的请求。

【讨论】：