AWS API网关没有"Access-Control-Allow-Origin"标头

use*_*345 26 ajax jquery amazon-web-services aws-lambda aws-api-gateway

我坚持使用API​​网关的问题,我已经在这个AWS论坛上完成了所有其他的SO答案,并且已经通过他们的文档,但仍然没有乐趣.

我正在尝试使用AWS API网关设置API,该网关调用Lambda函数,该函数读取/写入DynamoDB中的表.

DynamoDB的Lambda函数正在运行.我在AWS中创建了一个API,并为它创建了一个GET和OPTIONS方法.我读AWS并没有强制执行只有GET/POST的选项,但是当没有OPTIONS方法时我在我的ajax调用中遇到了预检错误,所以我添加了一个.

目前为了取得进展,我没有使用API​​密钥或授权.我可以使用POSTMAN成功调用我的GET方法,POSTMAN返回DynamoDB表的内容.

但是当我尝试使用JQuery ajax调用时,我得到了

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
Run Code Online (Sandbox Code Playgroud)

我可以看到在网络选项卡下使用Chrome开发工具,OPTIONS方法返回状态200,GET返回状态200,但出现上述错误.

我已尝试在OPTIONS和GET方法上启用CORS,在每次更改后重新部署API,尝试了以下(http://enable-cors.org/server_awsapigateway.html)但总是得到相同的错误安慰.

我正在从桌面上的文件执行ajax调用,因此origin是null,因为页面将部署到S3作为JS中的单个Web页面应用程序.

当我在我的GET和OPTIONS上启用CORS时,我可以看到Access-Control-Allow-Headers是'Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token'和Access-Control-Allow-Origin*是'*'

我的Ajax调用如下所示.我也尝试复制POSTMAN使用的确切标题,它具有Authorization标头集(我现在已在AWS中关闭)但我总是得到相同的错误

var awsHeaders = {};
awsHeaders['X-Amz-Date'] = '20161127T171734';

$('#add, #cloud').click(function() {

    $.ajax({

        type: 'GET',
        headers: awsHeaders,
        dataType : "json",
        url: '...',
        success: function (res) {

            console.log('response in GET:');
            console.log(res);

        },
        error: function(data) {
            console.log('in error');
            console.log(data);
        }

    });

});
Run Code Online (Sandbox Code Playgroud)

任何人都可以阐明我可能会失踪的东西吗?

非常感谢

更新 请参阅下面的答案,关于我如何根据DigitalKapteain评论解决这个问题 - 在我的Lambda函数的响应中设置'Access-Control-Allow-Origin':'*'标题.我在AWS文档中查找了这个,但无法找到它.此链接描述了Lambda和Lambda Proxy之间的区别,并说明了使用CORS时要执行的操作https://serverless.com/framework/docs/providers/aws/events/apigateway/

Dig*_*aen 55

对Lambda函数的GET请求的响应也必须包含Access-Control-Allow-Origin标头.

  • @ user12345我没有在任何文档中找到这个,但实际行为表明应该在Lambda函数中设置标题. (5认同)
  • 我正在使用Lambda代理集成.所以我改变了Lambda函数也返回标题'Access-Control-Allow-Origin':'*',并且访问控制错误消失了.非常感谢您的帮助.因此,在使用代理集成时,标头是由Lambda函数设置的,而不是API网关中的方法响应? (4认同)
  • @ user12345您是使用Lambda代理集成还是在API网关中手动配置lambda调用?如果使用代理集成,则应在Lambda函数代码中设置标题. (3认同)
  • 说实话,使用集成不应该破坏CORS配置,因为这样会丢失很多时间,它们应该显示警告或其他东西. (3认同)
  • 谢谢@Digitalkapitaen.查看从OPTIONS请求返回的响应头它包含Access-Control-Allow-Methods:GET,OPTIONS和Access-Control-Allow-Origin:*,但是我没有看到Access-Control-Allow-Origin响应头GET请求.我已经在API网关的GET方法方法响应中设置它并重新部署API但我没有看到它返回.知道还需要设置哪个位置?非常感谢 (2认同)

Wor*_*red 26

Digitalkapitaen的回答是正确的; 这里是代码,以节省一些人在查找如何在Lambda中设置HTTP响应头的麻烦:

exports.handler = function(event, context, callback) {
    callback(null, {
        "statusCode": 200,
        "headers": { 
            "Access-Control-Allow-Origin": "*" 
        }
    });
};
Run Code Online (Sandbox Code Playgroud)


小智 5

如果这仍然不适合您,请确保在使用$ .ajax时JSON.stringify()您的json对象.如果没有,您仍将返回一个声称与CORS相关的错误的错误.但是如果使用Postman发送相同的json对象,请求将成功.试试看...