在现代 Web 应用程序中，我们经常使用第三方资源，如 JavaScript 库、CSS 文件和图像。但是，这些资源可能被黑客攻击，从而导致安全漏洞和数据泄露。为了防范这些威胁，ECMAScript 2021 引入了 Subresource Integrity（SRI）。
什么是 Subresource Integrity？
Subresource Integrity 是一种安全机制，用于验证从第三方源加载的资源是否与预期的内容相同。它通过使用哈希算法对资源进行完整性检查，以确保它们没有被篡改或替换。如果哈希值与预期的哈希值不匹配，则浏览器将拒绝加载该资源。
如何使用 Subresource Integrity？
要使用 Subresource Integrity，您需要在资源的标记中包含一个哈希值。可以使用多种哈希算法，如 SHA-256、SHA-384 和 SHA-512。以下是一个示例：
<script src="https://example.com/example.js" integrity="sha256-KC8EwWz+G6aKpMSD1p6b8WZ/j9E="></script>
在这个示例中，integrity 属性包含哈希值。这个值是使用 SHA-256 算法生成的，它确保了从 https://example.com/example.js 加载的 JavaScript 文件与预期的内容相同。
Subresource Integrity 的优点
使用 Subresource Integrity 有多个优点。以下是其中的一些：
提高安全性
Subresource Integrity 可以防止资源被篡改或替换，从而提高了应用程序的安全性。这可以防止黑客攻击和数据泄露。
提高可靠性
使用 Subresource Integrity 可以确保从第三方源加载的资源是可靠的。这可以让您放心使用其他组织的代码，而不必担心它是否被篡改。
提高性能
Subresource Integrity 可以减少网络请求和下载时间。如果浏览器已经缓存了资源，并且哈希值与预期的哈希值相同，则不需要再次下载它们。
Subresource Integrity 的缺点
Subresource Integrity 也有一些缺点。以下是其中的一些：
兼容性问题
Subresource Integrity 不是所有浏览器都支持。在某些旧版本的浏览器中，它可能无法正常工作。这意味着您需要确保您的应用程序可以在所有受支持的浏览器中正常工作。
增加复杂性
使用 Subresource Integrity 可能会增加复杂性。您需要对每个资源进行哈希值计算，并将其添加到标记中。这可能需要一些额外的工作，特别是对于大型应用程序。
结论
Subresource Integrity 是一种强大的安全机制，可以保护您的 Web 应用程序免受黑客攻击和数据泄露。虽然它可能会增加一些复杂性，并且不是所有浏览器都支持它，但它仍然是一个值得使用的工具。如果您想保护您的应用程序并确保从第三方源加载的资源是可靠的，请考虑使用 Subresource Integrity。
示例代码
以下是一个使用 Subresource Integrity 的示例：
-- -------------------- ---- -------
--------- -----
------
------
------------------ --------- ----------
-------
-------------------------------------------------
-----------------------------------------------------------------------------------
-----------------------
----------
-------
------
---------- -----------
--------
-------------------------- -- -
------------------- ------
---
---------
-------
-------在这个示例中，我们加载了 jQuery 库，并使用 SHA-384 算法生成了哈希值。如果该库被篡改或替换，浏览器将拒绝加载它。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/675a5588603a5f5ef66d7aeb