通過script標(biāo)簽加載跨域資源是一種常用的跨域請求解決方式笆环。那在HTML5中新增的crossorigin屬性攒至，有什么作用呢？難道以前不用 crossorigin 屬性的時(shí)候躁劣，會(huì)出什么問題嗎？到底可能會(huì)出什么問題呢库菲？
當(dāng)引入跨域的腳本時(shí)账忘，如果這個(gè)腳本有錯(cuò)誤，因?yàn)闉g覽器的限制（根本原因是協(xié)議的規(guī)定）熙宇，是拿不到錯(cuò)誤信息的鳖擒。當(dāng)本地嘗試使用 window.onerror 去記錄腳本的錯(cuò)誤時(shí)，跨域腳本的錯(cuò)誤只會(huì)返回 Script error烫止。
而 HTML5 新的規(guī)定蒋荚，是可以允許本地獲取到跨域腳本的錯(cuò)誤信息的，但有兩個(gè)條件：
- 跨域腳本的服務(wù)器必須通過 Access-Control-Allow-Origin 頭信息允許當(dāng)前域名可以獲取錯(cuò)誤信息
- 網(wǎng)頁里的 script 標(biāo)簽也必須指明 src 屬性指定的地址是支持跨域的地址馆蠕，也就是 crossorigin 屬性期升。
有了這兩個(gè)條件，就可以獲取跨域腳本的錯(cuò)誤信息：
但事情還是不夠明朗互躬，看起來跨域腳本報(bào)個(gè)錯(cuò)也沒什么啊播赁，為什么瀏覽器（準(zhǔn)確說是 HTTP 協(xié)議）這么軸，非要規(guī)定默認(rèn)情況頁面是不能獲取跨域腳本錯(cuò)誤信息的呢吼渡？
這其實(shí)跟網(wǎng)絡(luò)安全有關(guān)容为，不妨舉一個(gè)例子來說明。
我們先假設(shè)瀏覽器默認(rèn)可以將跨域腳本的錯(cuò)誤信息返回寺酪。
這個(gè)時(shí)候我在我的博客里寫下如下代碼：
<script src="http://某個(gè)銀行/會(huì)員信息網(wǎng)址">
<script src="http://某個(gè)銀行2/會(huì)員信息網(wǎng)址">
...
注意 src 里面提到地址坎背，都是 HTML 頁面的地址，當(dāng)成 JS 來執(zhí)行寄雀，肯定是會(huì)報(bào)錯(cuò)的得滤。
因?yàn)槲覀兗僭O(shè)瀏覽器能報(bào)具體錯(cuò)誤，這個(gè)錯(cuò)誤可能是類似于：
“請登錄” is undefined.
“您好” is undefined.
我們通過報(bào)錯(cuò)信息的不一致咙俩，可能可以推斷出當(dāng)前訪問我博客的會(huì)員在某某銀行是否有賬號耿戚。雖然不是什么大問題，但隱私的確是泄漏了阿趁，如果我是攻擊者我可能會(huì)通過判斷會(huì)員在某家銀行是否有賬號膜蛔，『精準(zhǔn)』推送相關(guān)的釣魚網(wǎng)站給他。
說清楚了來龍去脈脖阵，我們就可以更好的判斷皂股，我們是否真的需要給 script 標(biāo)簽加上 crossorigin 屬性了。另外除了 script命黔，所有能引入跨域資源的標(biāo)簽包括 link 和 img 之類呜呐，都有一樣的屬性,但他們的跨域?qū)傩詢H跟 canvas 有關(guān)就斤。關(guān)于 <img> / <link> 的 crossorigin 屬性解釋，見此篇文章蘑辑。
