上传文件的 Amazon S3 CORS 请求失败答案

【问题标题】：Amazon S3 CORS request fails for uploaded files上传文件的 Amazon S3 CORS 请求失败
【发布时间】：2015-03-09 02:43:49
【问题描述】：

我使用 Amazon S3 作为后端。我已正确配置存储桶以允许 CORS 访问我域中的任何内容。 我已测试它适用于常规文件（即通过 Amazon AWS 控制台或使用 S3 命令行工具上传）。

我的应用程序还将 JSON 文件本身上传到 S3 存储桶。有趣的是，它需要正确配置 CORS 才能成功上传。确实如此，我的 JSON 文件被放入存储桶中。

问题是，当我发出 CORS GET 请求 (jquery $.ajax)对于我之前上传的这些文件时，请求失败并显示典型消息

No 'Access-Control-Allow-Origin' header is present on the requested resource.

请注意，对于同一存储桶、同一路径中的任何其他文件，如果不是由应用程序上传，而是通过控制台或命令行工具上传，则请求成功。

为什么会这样？

我的 CORS 配置：

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

【问题讨论】：

你是通过 localhost 做 ajax 请求吗？这可能是同源政策问题（developer.mozilla.org/en-US/docs/Web/Security/…）吗？
这不是因为 GET 请求只对以前从应用程序上传的文件失败，如果我通过 S3 控制台或 S3CMD 上传它们会成功。
你也可以发布你的javascript代码吗？

标签： file-upload amazon-web-services amazon-s3 cors

【解决方案1】：

在 jQuery 文档的某个地方，您可以找到 $.ajax 的选项。

jQuery.support.cors = true;
...
$.ajax(
    url,
    {
        crossDomain: true,
        data: {
            sampleData
        },
        success: function() {
            alert('Yeaaahhh')
        },
        error: function(a,b,c) {
            alert('failed');
        },
        type: 'post'
    }
);

但最好使用 XMLHTTPRequest。喜欢：

var xhr = new XMLHTTPRequest;
xhr.open('POST', url);
xhr.onreadystatechange = function(state, status){
    //do something
};

xhr.onload = function(event){
    //do something
};

xhr.onerror = function(event){
    //do something
};

xhr.send(data);

问候。

【讨论】：