request.integrity 属性用于获取或设置请求的子资源完整性（Subresource Integrity，SRI）哈希。SRI 是一种安全机制，用于验证从服务器加载的资源是否被篡改过。
概述
SRI 通过为每个外部资源提供一个哈希值来确保资源的完整性和可信度。当浏览器尝试加载一个资源时，它会计算该资源的实际哈希值，并将其与 integrity 属性中提供的哈希值进行比较。如果两者匹配，则表明资源未被篡改；如果不匹配，则会阻止资源加载。
使用场景
SRI 主要用于以下几种场景：
- 加载第三方库和脚本，防止这些脚本被恶意篡改。
- 确保本地资源（如 CSS 文件、图片等）未被篡改。
- 在 CDN 上加载资源时，确保资源的完整性。
示例代码
设置 request.integrity 属性
// javascriptcn.com 代码示例
const integrityValue = 'sha256-3B2GQYy0JjQ0l8fK7eRnZqzFtU9Gd0jX4LmMxWkPjE=';
fetch('https://example.com/script.js', {
integrity: integrityValue,
mode: 'no-cors'
})
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.text();
})
.then(data => console.log(data))
.catch(error => console.error('Error:', error));获取 request.integrity 属性
const request = new Request('https://example.com/style.css', {
integrity: 'sha256-3B2GQYy0JjQ0l8fK7eRnZqzFtU9Gd0jX4LmMxWkPjE='
});
console.log(request.integrity); // 输出：sha256-3B2GQYy0JjQ0l8fK7eRnZqzFtU9Gd0jX4LmMxWkPjE=详细说明
什么是 SRI？
SRI 是一种安全机制，允许用户确保从服务器加载的资源未被篡改。通过在 <script> 或 <link> 标签中添加 integrity 属性，可以指定资源的哈希值。当浏览器加载资源时，它会自动计算资源的实际哈希值，并将其与 integrity 属性中的哈希值进行比较。如果两者不一致，浏览器将拒绝加载该资源。
如何生成哈希值？
要使用 SRI，首先需要为资源生成哈希值。可以使用命令行工具如 OpenSSL 来生成哈希值。例如，对于一个 JavaScript 文件，可以使用以下命令生成 SHA-256 哈希值：
openssl dgst -sha256 -binary script.js | openssl base64
这将输出一个哈希值，你可以将其添加到 HTML 文件中的 integrity 属性中。
支持的哈希算法
目前支持的哈希算法有：
- SHA-256
- SHA-384
- SHA-512
这些算法的前缀分别是 sha256-、sha384- 和 sha512-。例如，SHA-256 的哈希值应该以 sha256- 开头。
注意事项
- 使用 SRI 时，必须确保哈希值正确无误，否则可能会导致资源无法加载。
- SRI 仅适用于 HTTPS 请求。对于 HTTP 请求，浏览器不会检查哈希值。
- 如果服务器返回的内容类型与预期不符（例如，文本文件被当作二进制文件处理），可能会导致哈希值不匹配。
实践建议
- 在生产环境中始终启用 SRI，以确保加载的资源未被篡改。
- 定期更新哈希值，以应对资源内容的变更。
- 对于动态生成的资源，可以考虑使用服务器端签名来生成哈希值。
总结
request.integrity 属性是 Fetch API 中的一个重要功能，它使开发者能够利用 SRI 来提高应用的安全性。通过正确配置和使用 integrity 属性，可以有效防止资源被篡改，从而提升应用的整体安全性。