Amazon web services AWS API网关和S3上的CORS
我正在调用一个使用lambda函数的AWSAPI。我从一个HTML页面调用它,该页面位于S3静态web托管中。调用API时,我收到CORS错误: 从源代码访问位于的XMLHttpRequest 已被CORS策略阻止:否 “Access Control Allow Origin”标头出现在请求的服务器上 资源 在API上启用CORS后,我尝试过它,在S3 bucket上指定CORS,但它不起作用。 似乎,我错过了正确的位置,CORS头将被指定 其他信息: 我在chrome开发者工具中获得以下信息Amazon web services AWS API网关和S3上的CORS,amazon-web-services,cors,Amazon Web Services,Cors,我正在调用一个使用lambda函数的AWSAPI。我从一个HTML页面调用它,该页面位于S3静态web托管中。调用API时,我收到CORS错误: 从源代码访问位于的XMLHttpRequest 已被CORS策略阻止:否 “Access Control Allow Origin”标头出现在请求的服务器上 资源 在API上启用CORS后,我尝试过它,在S3 bucket上指定CORS,但它不起作用。 似乎,我错过了正确的位置,CORS头将被指定 其他信息: 我在chrome开发者工具中获得以下信息
**Response Headers**
content-length: 42
content-type: application/json
date: Mon, 24 Feb 2020 04:28:51 GMT
status: 403
x-amz-apigw-id: IYmYgFQvoAMFy6Q=
x-amzn-errortype: MissingAuthenticationTokenException
x-amzn-requestid: 79b18379-383d-4ddb-a061-77f55b5727c3
**Request Headers**
authority: apiid-api.us-east-1.amazonaws.com
method: POST
path: /Prod
scheme: https
accept: application/json, text/javascript, */*; q=0.01
accept-encoding: gzip, deflate, br
accept-language: en-US,en;q=0.9,hi;q=0.8
access-control-allow-headers: Origin, X-Requested-With, Content-Type, Accept, Authorization
access-control-allow-methods: GET, OPTIONS
access-control-allow-origin: https://apiid.execute-api.us-east-1.amazonaws.com/Prod
content-length: 117
content-type: application/json; charset=UTF-8
origin: http://example.com
referer: http://example.com/
sec-fetch-mode: cors
sec-fetch-site: cross-site
user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.130 Safari/537.36
Lambda函数代码:
var AWS = require('aws-sdk');
var ses = new AWS.SES();
var RECEIVER = 'example@gmail.com';
var SENDER = 'example@gmail.com';
var response = {
"isBase64Encoded": false,
"headers": { 'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*'},
"statusCode": 200,
"body": "{\"result\": \"Success.\"}"
};
exports.handler = function (event, context) {
console.log('Received event:', event);
sendEmail(event, function (err, data) {
context.done(err, null);
});
};
function sendEmail (event, done) {
var params = {
Destination: {
ToAddresses: [
RECEIVER
]
},
Message: {
Body: {
Text: {
Data: 'name: ' + event.name + '\nphone: ' + event.phone + '\nemail: ' + event.email + '\ndesc: ' + event.desc,
Charset: 'UTF-8'
}
},
Subject: {
Data: 'Website Referral Form: ' + event.name,
Charset: 'UTF-8'
}
},
Source: SENDER
};
ses.sendEmail(params, done);
}
请求的资源上不存在“Access Control Allow Origin”标头
这意味着,您请求的资源,即通过API网关的Lambda,在其响应中没有返回访问控制允许源报头;浏览器希望API的响应中包含CORS头,可能是因为OPTIONS请求,但响应中没有这些头
您并没有明确说过,但我假设您正在API网关上使用Lambda代理集成。要解决您的问题,请在Lambda返回的响应中添加访问控制Allow Origin:*标题。您尚未指定Lambda所用的语言,也未提供Lambda代码,但如果是在NodeJS中,则返回的代码片段可能类似于:
const result = {
statusCode: 200,
headers: {
'Access-Control-Allow-Origin': '*',
// other required headers
},
body: object_you_are_returning
};
return result;
非常令人惊讶的是,原因似乎是“客户端不应该有‘访问控制允许源代码’:‘*’。显然,这应该只在Lambda代码中,并且将其添加到jQuery代码中会导致飞行前由于某种原因而失败。” 在评论之后补充信息: 我还尝试使用S3中托管的ajax通过API网关调用Lambda函数。我尝试了很多建议,尤其是这个解决方案,但没有一个对我有效。在Chrome的开发者模式下,我一直看到从源代码“[my S3 website]”访问“[my API]”处的XMLHttpRequest时出现的错误已被CORS策略阻止:飞行前响应中的访问控制允许标头不允许请求标头字段访问控制允许源代码。我通过删除ajax中的“访问控制允许源代码”:“*”解决了这个问题。仍然以解决方案为例,它将通过改变
$.ajax(
{
url: 'https://npvkf9jnqb.execute-api.us-east-1.amazonaws.com/v1',
headers: {'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*'
},
crossDomain: true,
type:'GET',
dataType: 'text',
success: function(data)
{
window.alert(data);
}
});
进入
我试过了。想知道我犯了什么错误。将CORS标题添加到Lambda的响应中。感谢您的回复。我签入了Lambda函数。它是在Node.js中编写的,标头是以以下格式指定的:var response={isBase64Encoded:false,标头:{'Content Type':'application/json','Access Control Allow Origin':'*},statusCode:200,body:{\result\:\Success.\};我看过了,你确实做出了回应,但您在发送电子邮件后不会将其返回给来电者。现在,我可以通过以下地址访问XMLHttpRequest'https://apiid.execute-api.us-east-1.amazonaws.com/Prod“起源”http://example.com'已被CORS策略阻止:飞行前的访问控制允许标头不允许请求标头字段访问控制允许来源回答无论我是否在函数中添加了return。看起来您原来的问题已经解决,这是一个新的错误。。。在您的选项请求中,您可能不允许使用标题。您知道指定选项的正确位置吗?我很困惑,因为有很多地方可以指定选项:S3 bucket上的网页js文件2 CORS配置,API gateway上的CORS配置,Lambda function Node.js上的4个头。我做了几次尝试,但都没有成功。欢迎使用StackOverflow,如果需要了解答案,请添加更多的描述和代码,因为这将解决其他人的问题,同时感谢提醒。我还尝试使用S3中托管的ajax通过API网关调用Lambda函数。我尝试了很多建议,尤其是这个解决方案,但没有一个对我有效。在Chrome的开发者模式下,我一直看到从源代码“[my S3网站]”访问“[my API]”处的XMLHttpRequest时出错,已被CORS策略阻止:飞行前响应中的访问控制允许标头不允许请求标头字段访问控制允许源代码。我通过删除ajax中的“访问控制允许源代码”:“*”解决了这个问题。
$.ajax(
{
url: 'https://npvkf9jnqb.execute-api.us-east-1.amazonaws.com/v1',
headers: {'Content-Type': 'application/json'},
crossDomain: true,
type:'GET',
dataType: 'text',
success: function(data)
{
window.alert(data);
}
});