AWS API Gateway - CORS + POST 不起作用 [英] AWS API Gateway - CORS + POST not working

问题描述

CORS 真的让我发疯了，我真的不知道如何让它发挥作用.

CORS is really driving me crazy and I'm really out of ideas as of what to try to make it work.

我创建了一个简单的 APIG Api，其中包含 1 个名为abc"的资源，并添加了 2 个方法 GET 和 POST 都将 Authorization 设置为NONE 和 API Key Required 设置为 false，所有内容都部署到名为dev"的阶段.

I have created a simple APIG Api with 1 resource called 'abc' and added 2 methods GET and POST both with Authorization set to NONE and API Key Required set to false, everything deployed to a stage called 'dev'.

当然，我在这两种方法上都启用了 CORS，我看到了 3 个标题 Access-Control-Allow-Origin、Access-Control-Allow-Headers 和 Access-Control-Allow-Methods 添加到 OPTIONS 方法中，Access-Control-Allow-Origin 添加到 em>POST 和 GET 方法.

Of course I enabled CORS on both methods and I see the 3 headers Access-Control-Allow-Origin, Access-Control-Allow-Headers and Access-Control-Allow-Methods added to the OPTIONS method and the Access-Control-Allow-Origin added to the POST and GET methods.

两个调用都映射到相同的 lambda 函数，该函数只是将Hello from Lambda"文本输出到控制台.

Both calls are mapped to the same lambda function that simply outputs a 'Hello from Lambda' text to the console.

然后我创建了一个简单的 html 页面，我在 S3 上作为 静态网站 托管，使用 Route53 将域指向它并开始使用 jQuery $.ajax 测试 API 以进行调用.

Then I have created a simple html page I hosted as a static website on S3, pointed a domain to it using Route53 and started testing the API using jQuery $.ajax to make the calls.

一切看起来都简单、直接并且完全按照文档中的说明进行，除了只有 GET 可以正常工作并将文本按预期输出到控制台.POST 版本导致以下错误:

All seems easy, straightforward and exactly as explained in the docs, except only the GET works and outputs the text to the console as expected. The POST version results in the following error:

请求的资源上不存在Access-Control-Allow-Origin"标头.因此，不允许访问来源http://example.com".响应的 HTTP 状态代码为 400.

预检调用有效并返回 200 OK 并且所有标头都在那里，但 POST 调用返回该错误和 400 Bad Request.

The preflight call works and returns 200 OK and all headers are there, but the POST call returns that error and a 400 Bad Request.

非常感谢任何帮助，我希望 AWS 团队也在关注...

Please any help is really appreciated, I hope the AWS team is watching too...

谢谢各位.

已编辑 - 从谷歌浏览器复制:

EDITED - Copied from Google Chrome:

POST 原始请求标头:

POST Raw Request Headers:

POST /dev/urls HTTP/1.1
Host: kykul1mshe.execute-api.us-east-1.amazonaws.com
Connection: keep-alive
Content-Length: 73
Accept: application/json, text/javascript, */*; q=0.01
Origin: http://example.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36
Content-Type: application/json
Referer: http://example.com/dev.html
Accept-Encoding: gzip, deflate, br
Accept-Language: fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4

POST 原始响应标头:

POST Raw Response Headers:

HTTP/1.1 400 Bad Request
Date: Fri, 19 Aug 2016 02:14:16 GMT
Content-Type: application/json
Content-Length: 177
Connection: keep-alive
x-amzn-RequestId: a1160e45-65b2-11e6-9766-cd61e49fbcdb
X-Cache: Error from cloudfront
Via: 1.1 d64756b4df47ce24d6c62b5a8de97e87.cloudfront.net (CloudFront)
X-Amz-Cf-Id: N9mf7apicKbSM_MiZjePbEgZGIFKckWJ3lZljH8iHVKFVTcIIOQuHg==

这会返回 400 错误请求

This returns 400 Bad Request

OPTIONS 原始请求标头:

OPTIONS Raw Request Headers:

Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4
Access-Control-Request-Headers:accept, content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:kykul1mshe.execute-api.us-east-1.amazonaws.com
Origin:http://example.com
Referer:http://example.com/dev.html
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36

OPTIONS 原始响应标头:

OPTIONS Raw Response Headers:

Access-Control-Allow-Headers:Content-Type,X-Amz-Date,Authorization,X-Api-Key,Cache-Control,X-Requested-With
Access-Control-Allow-Methods:POST,OPTIONS
Access-Control-Allow-Origin:*
Connection:keep-alive
Content-Length:79
Content-Type:application/json
Date:Fri, 19 Aug 2016 02:14:16 GMT
Via:1.1 d64756b4df47ce24d6c62b5a8de97e87.cloudfront.net (CloudFront)
X-Amz-Cf-Id:KpGEDmIuf5RHcUnBWuA3oEMZgWHwrjy3SpLuOflRhAD8IIx5vyKGSw==
x-amzn-RequestId:a10bae11-65b2-11e6-bcf7-63b49c24629e
X-Cache:Miss from cloudfront

这会返回 200 OK

This returns 200 OK

推荐答案

如果您在 API Gateway 中使用代理集成，则从 API Gateway 启用 CORS 不起作用.您必须从您的 Lambda 代码本身设置标头Access-Control-Allow-Origin".

If you are using proxy integration in API Gateway, then enabling CORS from API Gateway doesn't work. You have to set the Header 'Access-Control-Allow-Origin' from your Lambda code itself.

它在 文档.

Python 代码示例:

Python code sample:

    response = {
        'statusCode': 200,
        'headers': {
            'Access-Control-Allow-Origin': '*'
        },
        'body': json.dumps({'message': 'CORS enabled')
    }
    return response

这篇关于AWS API Gateway - CORS + POST 不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！