如何解决"No 'Access-Control-Allow-Origin' header is present on the requested resource"错误？

Question

我有两个 S3 存储桶。 一个是拥有图像和 PDF 数据(通过 CloudFront(，第二个是静态托管在 S3 上。 当我从我的 URL 调用图像时，它被加载了，但是当我调用 pdf 时，它向我显示以下错误：-->

"CORS策略已阻止从源'url'获取'pdf链接'的访问：请求的资源上不存在'访问控制-允许-源'标头。如果不透明的响应满足您的需求，请将请求的模式设置为"no-cors"，以便在禁用 CORS 的情况下获取资源"。

为了解决这个问题，我设置了 S3 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>
<AllowedMethod>POST</AllowedMethod>
<AllowedMethod>PUT</AllowedMethod>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

我还设置了 cloudfront，将"访问控制-请求-标头"、"访问控制-请求-方法"、"来源"这些错误列入白名单，并选择 GET、PUT、OPTIONS 以及。

建议我如何解决此错误？

Answer 1

最后，我克服了这个问题。主要问题是将协议从"HTTP重定向到HTTPS"。 当我从 HTTP 发送请求时，CloudFront 会将其重定向到 HTTPS 上。通过此重定向，我的图像正在加载，但pdf没有，它在重定向过程中失败。 然后，我将 CloudFront 的查看器控制协议更改为仅限 HTTP，现在它可以工作了。 您也可以将其设置为 HTTP 和 HTTPS。