integrity - 定義必須匹配的資源的哈希值(如校驗和)，以使瀏覽器執行它。 哈希確保文件未經修改并包含預期數據。 這樣瀏覽器就不會加載不同的(例如惡意的)資源。 想象一下你的JavaScript文件被CDN攻擊的情況，并且沒有辦法知道它。 完整性屬性可防止加載不匹配的內容。

無效的SRI將被阻止(Chrome開發人員 - 工具)，無論其是否來源。 在完整性屬性不匹配時的NON-CORS情況下：

完整性可以使用以下公式計算：[https://www.srihash.org/]或者輸入控制臺(鏈接)：

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

crossorigin - 定義從不同來源的服務器加載資源時使用的選項。 (請參閱此處的CORS：[https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS)。]它有效地更改了瀏覽器發送的HTTP請求。 如果添加“crossorigin”屬性 - 它將導致添加原點：＆lt; ORIGIN＆gt; 鍵值對進入HTTP請求，如下所示。

crossorigin可以設置為：“anonymous”或“use-credentials”。 兩者都會導致將原點添加到請求中。 然而，后者將確保檢查憑證。 標記中沒有crossorigin屬性將導致發送沒有origin的請求：鍵值對。

以下是從CDN請求“use-credentials”的情況：

integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn"

crossorigin="use-credentials">

如果錯誤設置了crossorigin，瀏覽器可以取消該請求。

鏈接

- [https://www.w3.org/TR/cors/]

- [https://tools.ietf.org/html/rfc6454]

- [https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link]

博客

- [https://frederik-braun.com/using-subresource-integrity.html]

- [https://web-security.guru/en/web-security/subresource-integrity]

總結

以上是生活随笔為你收集整理的html完整性检测,html - 什么是完整性和crossorigin属性？的全部內容，希望文章能夠幫你解決所遇到的問題。

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