Question

我正在尝试使用这些CORS配置从Amazon s3获取图像：

<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>

我收到的错误是：

Image from origin 'https://s3.amazonaws.com' has been blocked from loading by Cross-Origin     Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我在Chrome中收到此错误，但在Firefox中未收到此错误。我试过浏览但没有找到解决方案。任何人都可以帮我解决这个问题吗？

由于

Answer 1

我一直关注AWS的问题，我看到了这个问题。这个问题（以及类似的问题）的问题在于它只向社区公开了一半的等式（CORS配置）。＆＃34; C＆＃34;在MVCE中肯定不满意。

等式中缺少的一半是您尝试访问前端资源的方式。具体而言，发送的请求标头非常重要。

您使用的是fetch吗？ canvas？亚马逊SDK？就像是 domtoimage？
您是否已捕获了该请求标头请求失败？
- 如果是这样，为什么他们不在问题中？

CORS基础知识

如果您没有发送origin请求标头，那么您将无法获得CORS响应标头。如果您确实发送了origin标头，并且允许来源，则应该返回CORS标头。就这么简单。

因此，您首先应该排除丢失的origin标头。您确定要发送origin标题吗？更常见的是，您使用的图书馆是否正在发送图书馆？如果你深入挖掘一下，真正的问题可能是＆＃34;为什么我的请求中没有origin标题？＆＃34;

旁注：您可以使用Requestly等浏览器扩展程序从所有传出请求中删除origin标头，并对所有中断的内容进行惊叹。

适用于x，但不适用于

返回我的＆＃34;发布您的请求标题＆＃34; soapbox - 如果Chrome和Firefox的行为不同，您是否确认每个人都在发送相同的标题集？

浏览器为您设置了几个标头，浏览器实现may make different choices关于哪些标头要发送。

从Amazon s3获取图像会出现CORS错误。（Chrome问题）

1 个答案:

从Amazon s3获取图像会出现CORS错误。 （Chrome问题）

1 个答案:

从Amazon s3获取图像会出现CORS错误。（Chrome问题）