Amazon S3 图像 CORS 问题

Question

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

我正在为 CDN 使用 amazon cloudfront。有人可以告诉我为什么我仍然看不到 Access-Control-Allow-Origin:"*" 吗？

我的 S3 cors

Answer 1

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

在AWS S3上添加CORS权限

1. 打开特定的存储桶。
2. 然后点击顶部的权限选项卡
3. 然后滚动到最后，您将找到 CORS 配置。只需点击编辑即可。
4. 然后将以下配置粘贴到

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

5. 您还可以在AllowedOrigin内添加自定义域

从 API 调用中删除缓存

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

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

Answer 2

这是我的设置，您需要在 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 调用设置的唯一方法

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

喜欢：