【问题标题】：Amazon S3 image CORS issueAmazon S3 映像 CORS 问题
【发布时间】：2018-10-05 22:24:30
【问题描述】：

' from origin 'http://example.com' 已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin 'http://example.com' 因此不允许访问。

我正在为 CDN 使用亚马逊 cloudfront。谁能告诉我为什么我仍然看不到 Access-Control-Allow-Origin:"*"？

我的 S3 cors

【问题讨论】：

设置CORS后是否使缓存失效？您是否将 CloudFront 缓存行为中的 Origin 和其他 CORS 请求标头列入白名单？
也许您的屏幕截图已经剪切了配置文件的 LHS，否则它看起来无效。您是否只接收 GET 请求？
Michael-sqlbot ：我已将 Origin 和其他标头列入白名单。仍然存在同样的问题。不允许使用 CORS。
@mhawke 是的，我只收到获取请求。但不允许使用 CORS。

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

【解决方案1】：

这是我的设置，您需要在 S3 以及 CloudFront 中编辑 CORS

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

我不知道它是否是协议的一部分，但这是我可以为 CORS 调用设置的唯一方法

您还需要将您的 CDN 行为的Origin 列入白名单

喜欢：

【讨论】：

还是同样的问题。当我在在线 CORS 检查中进行测试时，响应是这样的“触发 XHR 事件：loadstart 触发 XHR 事件：readystatechange 触发 XHR 事件：进度触发 XHR 事件：错误 XHR 状态：0 XHR 状态文本：触发 XHR 事件：loadend”
@Venkatesh 不知道你在说什么，但是做一个简单的测试，去 jQuery 主页并执行 $.get(url,(d)=>{console.log(d);}); 并使用 文本文件 设置 var url = '';您正在测试的 CDN 的 url。

【解决方案2】：

我正在写这个答案，因为我被这个问题困扰了将近一天。

在 AWS S3 上添加 CORS 权限

打开特定的桶。
然后点击顶部的权限标签
然后滚动到最后，你会发现CORS配置。只需点击编辑。
然后将下面的配置粘贴进去

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": []
    }
]

您还可以在 AllowedOrigin 中添加自定义域

从 API 调用中移除缓存

我已经完成了上述更改，但我仍然一次又一次地面临同样的问题。我通过禁用 API 的缓存来解决这个问题。我使用fetch 来调用s3 URL。下面是它的代码。

fetch(
    <s3 URL>,
    {
        method: 'GET',
        headers: { "Cache-Control": 'no-cache' },
    }
)

【讨论】：