交叉属性的目的.？

Question

在图像和脚本标记中。

我的理解是，您可以访问其他域上的脚本和图像。那么，何时使用这个属性呢？

这是当你想限制别人访问你的脚本和图像的能力吗？

图片：

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-crossorigin

剧本：

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script

Answer 1

启用CORS的图像可以在元素中重用，而不会受到污染。允许的值是：

这一页已经回答了你的问题。

如果您有一个跨源映像，您可以将其复制到一个画布中，但是这会“污染”画布，从而阻止您读取它(因此您不能“窃取”图像，例如从网站本身无法访问的intranet中)。但是，通过使用CORS，存储图像的服务器可以告诉浏览器允许跨源访问，因此您可以通过画布访问图像数据。

MDN还有一个关于这件事的页面：图像。

这是当你想限制别人访问你的脚本和图像的能力吗？

不是的。

Answer 2

答案可以在规格中找到。

对于img

crossorigin属性是一个CORS设置属性。它的目的是允许来自第三方网站的图像允许跨源访问与canvas一起使用。

对于script

crossorigin属性是一个CORS设置属性。对于从其他起源获得的脚本，它控制是否公开错误信息。

Answer 3

这就是我们如何在crossorigin标记中成功地使用了script属性：

问题:我们试图使用window.onerror记录服务器中的js错误。

我们日志记录的几乎所有错误都有这样的信息：Script error.，而我们几乎没有得到关于如何解决这些js错误的信息。

原来，chrome中的本机实现可以报告错误。

if (securityOrigin()->canRequest(targetUrl)) {
        message = errorMessage;
        line = lineNumber;
        sourceName = sourceURL;
} else {
        message = "Script error.";
        sourceName = String();
        line = 0;
}

如果请求的静态资产违反浏览器的message，将以Script error.的形式发送同源政策。

在我们的例子中，我们服务的是来自cdn的静态资产。

解决方法是将crossorigin属性添加到script标记中。

P.S.从这个答案得到了所有信息