Amazon s3 存储桶、CORS 问题、标头来源

Question

我们正在使用 Amazon s3 存储桶来存储我们的文件。在前端，我们必须这样做：

fetch('https://some-bucket.s3.eu-central-1.amazonaws.com/some-bucket/4575/some-image.png');

在 amazon s3 bucket 配置上，我们添加了 cors 配置：

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

]

这里的主要问题是标题来源。在某些情况下浏览器设置标题来源在某些情况下没有。

一切正常时的示例：

GET /some-bucket/4016/Elephant_Large_PNG_Clipart-1047.png HTTP/1.1
Host: some-bucket.s3.eu-central-1.amazonaws.com
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="90", "Google Chrome";v="90"
Accept: application/json, text/plain, */*
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.93 Safari/537.36
Origin: https://some-domain.com
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: https://some-domain.com/
Accept-Encoding: gzip, deflate, br
Accept-Language: ru-RU,ru;q=0.9,en-US;q=0.8,en;q=0.7,uk;q=0.6

这是一个由于缺少原始标头而失败的请求。

GET /some-bucket/4608/469705261---Copy.jpeg HTTP/1.1
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="90", "Google Chrome";v="90"
Accept: application/json, text/plain, /
Referer: https://some-domain.com/
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.93 Safari/537.36

在亚马逊文档中，我们可以看到 - origin 标头是必需的。没有原始标题，cors 问题。 Origin 标头发送，cors 运行良好。

我们还有一件更重要的事情，我们在前端使用https://quasar.dev/。

我们决定创建没有任何前端框架的纯 js。只是为了测试。简单的 html 只是用 fetch。它无处不在！它发送了标头来源。

我们在以下方面进行了测试： Firefox - 在所有情况下都可以。 Chrome - 存在问题。

此时我们正在使用 nginx 的解决方法，例如亚马逊 s3 存储桶的代理服务器，但我们想直接使用 s3 存储桶。

我很困惑。请分享你的想法，或者我们可能遗漏了一些东西。我会很高兴的。谢谢！

Answer 1

我们解决了这个问题，this article 帮助了我们。我们添加这个“？some-parameter = some-unique-text”它解决了问题。浏览器缓存问题。