Html5从Amazon AWS s3获取桶错误：请求的资源上不存在访问-控制-允许-起源标头

Question

在我的应用程序中，我尝试使用fetch API从AWS S3存储桶中获取文件：

const response = await fetch(baseUrl + url);

我得到以下错误：

在'https://my-bucket.s3.amazonaws.com/uploads/044_IMH7kfc.m4a?AWSAccessKeyId=AKIAZB4Y4NZS

这是我的AWS桶中的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>POST</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
    <ExposeHeader>Access-Control-Allow-Origin</ExposeHeader>
</CORSRule>
</CORSConfiguration>

获取API在我的应用程序说没有'访问-控制-允许-起源'标头存在于请求的资源，但"访问-控制-允许-起源"在CORS配置中应该添加该标头，没有？

我尝试了这里发布的所有解决方案，但没有成功：使用HTML5获取API的允许访问-控制-允许-起源头

我还找到了AWS故障排除页面，但这也没有帮助：https://docs.aws.amazon.com/AmazonS3/latest/dev/cors-troubleshooting.html

我错过了什么？

Answer 1

我想问题在于格式，因为新的S3控制台只允许JSON格式。

祝你好运，我希望这对你有帮助。