HTML 属性：crossorigin

crossorigin 属性在 <audio>、<img>、<link>、<script> 和 <video> 元素中有效，它们提供对 CORS 的支持，定义该元素如何处理跨源请求，从而实现对该元素获取数据的 CORS 请求的配置。根据元素的不同，该属性可以是一个 CORS 设置属性。

在媒体元素上所使用的 crossorigin 内容属性为 CORS 设置属性。

这些属性是枚举的，并具有以下可能的值：

anonymous: 请求使用了 CORS 标头，且证书标志被设置为 'same-origin'。没有通过 cookies、客户端 SSL 证书或 HTTP 认证交换用户凭据，除非目的地是同一来源。
use-credentials: 请求使用了 CORS 标头，且证书标志被设置为 'include'。总是包含用户凭据。
"": 将属性名称设置为空值，如 crossorigin 或 crossorigin=""，与设置为 anonymous 的效果一样。

不合法的关键字或空字符串会视为 anonymous 关键字。

默认情况下（即未指定该属性时），CORS 根本不会使用。用户代理不会要求对资源进行完全访问的许可，在跨源请求的情况下，将根据相关元素的类型进行某些限制：

元素	限制
`img`、`audio`、`video`	当资源被放置在 `<canvas>` 中时，元素会标记为被污染的。
`script`	对错误日志 `window.onerror` 的访问将会被限制。
`link`	使用了不合适的 `crossorigin` 标头的请求可能会被丢弃。

备注： 在 Firefox 83 版本之前，rel="icon" 元素不支持 crossorigin 属性。也有一个 Chrome 的未解决的议题。

示例：使用 `crossorigin` 的 `<script>` 元素

你可以使用下面的 <script> 元素告诉浏览器执行来自 https://example.com/example-framework.js 的脚本且不发送用户凭据。

html

<script
  src="https://example.com/example-framework.js"
  crossorigin="anonymous"></script>

示例：带有用户凭据的 Web 清单

在获取需要用户凭据的清单时，即使是同源的情况，属性值也必须设置为 use-credentials。

html

<link rel="manifest" href="/app.webmanifest" crossorigin="use-credentials" />