AWS - 对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头答案

【问题标题】：AWS - Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resourceAWS - 对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头
【发布时间】：2017-11-11 07:29:32
【问题描述】：

我真的是 AWS 新手，所以请多多包涵 :(

我目前正在制作一个具有上传照片功能的网络应用程序。我想将这些照片保存在 S3 存储桶中，并将对它们的引用保存在我的数据库中。我目前正在关注本指南：http://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/s3-example-photo-album.html

但是，我已经完成了指南中所述的所有操作（或者至少我希望如此），但是当我运行应用程序并运行 createAlbum() 方法时，我收到了错误：

XMLHttpRequest 无法加载 https://my-bucket-name.s3-us-west-2.amazonaws.com/myalbumname/。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问 Origin 'http://localhost:3000'。

我确保 Bucket 权限中的所有用户都允许权限，我按照文档的指示更新了 CORS 配置，并更新了角色策略。

这是我的凭据代码：

var albumBucketName = '我的存储桶名称'; //显然不是真正的价值

var bucketRegion = 'us-west-2';

var IdentityPoolId = 'my-identity-pool-id'; //这里也是

AWS.config.update({

区域：bucketRegion，

凭证：新 AWS.CognitoIdentityCredentials({

IdentityPoolId：IdentityPoolId

})

});

var s3 = 新 AWS.S3({ apiVersion: '2006-03-01', 参数：{桶：albumBucketName} });

我一直试图找到一个没有成功的解决方案。有谁知道我需要做什么来解决这个问题？任何帮助是极大的赞赏！谢谢。

【问题讨论】：

不是以http://localhost:3000/ 测试您的网站，如果您以http://lvh.me:3000/ 测试您的网站，会发生什么不同吗？
这个问题你解决了吗？如果是，怎么做？

标签： javascript amazon-web-services amazon-s3

【解决方案1】：

S3 存储桶上的 CORS：

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

AllowedOrigin 中的 * 可用于测试目的。

您的存储桶将需要临时凭证，您可以做的是：

 // Set the region where your identity pool exists 
    AWS.config.region = 'us-east-1';

    // Configure the credentials provider to use an identity pool for temp 
    credentials
    AWS.config.credentials = new AWS.CognitoIdentityCredentials({
    IdentityPoolId: 'IDENTITY_POOL_ID',
    });

    // Make the call to obtain credentials
    AWS.config.credentials.get(function(){

    // Credentials will be available when this function is called.
    var accessKeyId = AWS.config.credentials.accessKeyId;
    var secretAccessKey = AWS.config.credentials.secretAccessKey;
    var sessionToken = AWS.config.credentials.sessionToken;

    var bucketName = 'bucket_name';

    var keyName = "key_name";

    var params = {Bucket: bucketName, Key: keyName, Body: 'Hello World!'};

    s3.putObject(params, function (err, data) {
    if (err)
    console.log(err)
    else
    console.log("Successfully uploaded data to " + bucketName + "/" + 
    keyName);
    });
    });

【讨论】：