script標簽中的crossorigin屬性

在前端監(jiān)控逐漸完善的今天，頁面中錯誤日志的上報可以說對我們的日常工作帶來了極大的幫助。

而使用 window.onerror 事件來捕獲 js 腳本中的錯誤信息是重要的手段 。

但是對于跨域的資源 ，onerror 事件通常會上報 "Script error"

由于這并不是 JavaScript 的 bug，所以瀏覽器出于安全考慮，會主動隱藏其他域下 js 拋出的具體錯誤信息，但是 onerror 事件可不管你這么多，就是直接上報 ，在不做過濾的情況下，你會在監(jiān)控平臺中看到特別的"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 的支持， 例如?、、、