Javascript 使用fetch方法从AWS S3下载文件时抛出CORS错误

我在AWS s3 bucket cors设置中添加了以下s3配置

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "PUT",
            "POST",
            "DELETE"
        ],
        "AllowedOrigins": [
            "https://*.herokuapp.com"
        ],
        "ExposeHeaders": []
    },
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": []
    }
]

现在，当我试图阅读它使用下面的JS，我得到了错误

async function covertToBlob(url) {
  // https://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html
  const resp = await fetch(url, {
    credentials: 'include',
  });
  const blobVal = await resp.blob();
  return blobVal;
}

错误是：

取 'https://dhdhddh.s3.amazonaws.com/docs/attachment/6f56abfe-a355-44b9-b728-a642f661a8e7/file/3ed4e889-e139-4755-81e9-5383310e07e7/remote_sounding_system_Hanla.pdf' 源于http://localhost:3000'已被CORS策略阻止： 响应中“Access Control Allow Origin”标头的值 当请求的凭据模式为时，不能为通配符“*” “包括”

您能告诉我如何解决这个问题吗？

注意：Access Control Allow Origin禁止对凭据为“include”的请求使用通配符。在这种情况下，必须提供确切的原产地；即使您正在使用CORS解除阻止扩展，请求仍将失败

这意味着，

AllowedOrigins

的值不能包含任何通配符。必须指定确切的原点

---

这符合Fetch API规范。

在CORS规则中是什么意思？我可以在不更改CORS规则的情况下更改JS吗？是的，在S3 bucket的CORS规则中。通过JS更改它的唯一方法是不使用

凭据：“include”

，在这种情况下，浏览器不会在跨源调用中发送凭据。如果我不使用

凭据：“include”

选项，那么我会得到

403

。在这种情况下，您调用的端点显然需要提交凭据。正如我所说的，使用Fetch API进行跨源请求的唯一方法是配置您的源（本例中是S3 bucket），以允许您的引用域在其

AllowedOrigins

CORS配置中。bucket必须包含获取请求来自的显式域，并且不能在其中使用任何通配符。是的，您是对的。一旦我添加了原点，它就开始工作了。谢谢你抽出时间。后来你让我做的事是有道理的。我老了-_-