Question

使用Google Chrome或Firefox时，如果我尝试加载以下HTML：

＆＃xA;＆＃xA;

 ＆lt; script crossorigin ='anonymous'src ='https：/ /stackoverflow.com/foo.js'></script>

我收到这样的CORS错误：

＆＃XA;＆＃XA;

＆＃XA;
从' https://stackoverflow.com/foo.js '访问脚本CORS策略已阻止https://stackoverflow.com“> https://stackoverflow.com ”：请求的资源上没有“Access-Control-Allow-Origin”标头...
＆＃xA;

＆＃xA;＆＃xA;

但是，没有 crossorigin ='anonymous'属性的相同标签工作正常（当然会产生404错误），因为foo.js不存在。）

＆＃xA;＆＃xA;

这是令人惊讶的，因为 anonymous 只是应该阻止发送任何凭据和脚本标记不应该要求CORS 。造成这种情况的原因是什么，我该怎么办？

＆＃xA;

Answer 1

我对此感到困惑了一段时间。以下是我现在的理解：

According to the W3C，crossorigin属性实际上有三个可能值：anonymous，use-credentials和“缺失值默认值”只能通过省略属性来访问。（另一方面，空字符串映射到anonymous。）默认值会导致浏览器完全跳过CORS，这是我期望的正常行为。

只有在我们关心获取正在加载的脚本的错误信息时，才应使用crossorigin属性。由于访问此信息需要进行CORS检查，因此资源上必须存在Access-Control-Allow-Origin标头才能加载。

Answer 2

crossorigin属性只有两个可能的值：anonymous或use-credentials。除anonymous以外的任何值（包括空值）都将转换为anonymous。

所以这三个标签具有相同的含义：

<script src="https://stackoverflow.com/foo.js" crossorigin="anonymous">
<script src="https://stackoverflow.com/foo.js" crossorigin="">
<script src="https://stackoverflow.com/foo.js" crossorigin="IamCrazy">

有趣的是，如果您跳过crossorigin属性，则CORS行为完全禁用。例如：

<script src="https://stackoverflow.com/foo.js">

此标记将运行脚本而不进行任何与CORS相关的检查。实际上，没有crossorigin属性使浏览器完全跳过Origin HTTP标头。

无论您的crossorigin是anonymous还是use-credentials，请求Origin仍必须符合回复Access-Control-Allow-Origin。否则没有运气 - 脚本永远不会被解雇。

来源：HTTP access control (CORS) on Mozilla Developer Network

Answer 3

这是一个有点旧的线程，但是最近这些事情我碰巧遇到了。除了 crossorigin ，您还应确保从中加载脚本的服务器（在示例中为stackoverflow.com）返回特定于标头。

只有这样，您才能收到有关脚本中发生的错误的完整信息。

使用<script crossorigin =“anonymous”>，为什么脚本“被CORS策略阻止”？

3 个答案: