Bootstrap 4?依賴的基礎庫中出現了兩個新的屬性

1

2

3

HTML5 新的規定，是可以允許本地獲取到跨域腳本的錯誤信息，但有兩個條件：一是跨域腳本的服務器必須通過?Access-Controll-Allow-Origin?頭信息允許當前域名可以獲取錯誤信息，二是當前域名的?script??標簽也必須指明?src?屬性指定的地址是支持跨域的地址，也就是 crossorigin 屬性。聽名字也知道是跨域的時候用的屬性，加載本地靜態文件根本就不牽涉跨域的問題，所以本地就不應該用它(理論上使用也沒關系，但瀏覽器就是這么定的，印象中如果 crossorigin 用在了本地文件上，瀏覽器報錯信息會告訴你 crossorigin 只能支持 http/https/… 等協議上，所以你非要加載本地靜態文件也不是沒辦法，只能自建本地 web 服務器然后地址寫帶 scheme 和 host 的完全絕對路徑)。

另外除了??script?，所有能引入跨域資源的標簽包括??link??和?img?之類，都有一樣的屬性。

integrity (大部分情況)是給 CDN 的靜態文件使用的，比如大名鼎鼎的 ajax.googleapis.com，或者國內的 cdn.bootcss.com。CDN雖然好但 CDN 有可能被劫持，導致下載的文件是被篡改過的(比如通過 DNS 劫持)，有了 integrity 就可以檢查文件是否是原版。但因為本地文件用的域名跟網頁是同一個域名，不存在劫持的問題(或者劫持就連網站本身一起被劫持了，那就不是 integrity 能解決的問題了)，所以本地靜態文件沒有太大必要用這個屬性。

當然，還有一種情況是你自己搭了一套提供靜態文件的獨立站點，這個時候用 integrity 是有意義。MDN 文檔里也提到了 integrity 值的生成方式，這里也再引用一下：

1 cat FILENAME.js | openssl dgst -sha384 -binary | openssl base64 -A

或者

1 shasum -b -a 384 FILENAME.js | awk '{ print $1 }' | xxd -r -p | base64

總之簡單一句話：只有當你的網頁域名和要載入的靜態文件存放的站點域名不一樣的時候，使用這兩個屬性才有意義(并且因瀏覽器的規定 crossorigin 屬性只有這個時候才能正常使用)。

原文出處：https://www.cnblogs.com/ihuangqing/p/10717018.html

總結

以上是生活随笔為你收集整理的html css integrity,HTML5 script 标签的 crossorigin 和integrity属性的作用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。