script标签中的crossorigin属性
前端精髓
共 1091字，需浏览 3分钟
·
2021-11-28 20:34
在前端监控逐渐完善的今天，页面中错误日志的上报可以说对我们的日常工作带来了极大的帮助。
而使用 window.onerror 事件来捕获 js 脚本中的错误信息是重要的手段 。
但是对于跨域的资源 ，onerror 事件通常会上报 "Script error"
由于这并不是 JavaScript 的 bug，所以浏览器出于安全考虑，会主动隐藏其他域下 js 抛出的具体错误信息，但是 onerror 事件可不管你这么多，就是直接上报 ，在不做过滤的情况下，你会在监控平台中看到特别的"Script error"错误日志。
而解决这个问题的一个办法之一就是在跨域资源的 script 标签中添加 crossorigin 属性
例如页面域名
my.com加载了跨域js脚本
<script src="user.com/index.js">script>这是在没有添加 crossorigin 属性的情况下，如果 user.com/index.js 中抛出了错误，在 my.com 页面中通过 onerror 事件是捕获不到具体错误信息的 ，只会捕获到 Script error 错误。
加载了具有 crossorigin 属性的跨域 js 脚本。
<script src="user.com/index.js" crossorigin >script>这样就可以获取到 user.com/index.js 中的具体错误信息了。
但是 crossorigin 属性并不是无脑加的！
我们先来看下 MDN 中对 crossorigin 的解释：
在HTML5中，一些 HTML 元素提供了对 CORS 的支持， 例如 、、、