Question

Bootstrapcdn最近改变了他们的链接。它现在看起来像这样：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" 
rel="stylesheet" 
integrity="sha256-MfvZlkHCEqatNoGiOXveE8FIwMzZg4W85qfrfIFBfYc= sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" 
crossorigin="anonymous">

integrity和crossorigin属性是什么意思？它们如何影响样式表的加载？

Answer 1

这两个属性已添加到Bootstrap CDN以实现Subresource Integrity。

子资源完整性定义了一种机制，通过该机制，用户代理可以验证是否已在没有意外操作的情况下传递了已获取的资源Reference

完整性属性是允许浏览器检查文件源，以确保在操作源时从不加载代码。

当使用'CORS'加载请求时，

存在Crossorigin属性。现在，当未从'same-origin'加载时，这是SRI检查的要求。 More info on crossorigin

More detail on Bootstrap CDNs implementation

Answer 2

完整性 - 定义必须匹配的资源（如校验和）的哈希值，以使浏览器执行它。哈希确保文件未经修改并包含预期数据。这样浏览器就不会加载不同的（例如恶意的）资源。想象一下你的JavaScript文件被CDN攻击的情况，并且没有办法知道它。完整性属性可防止加载不匹配的内容。

无效的SRI将被阻止（Chrome开发者工具），无论其来源如何。在完整性属性不匹配时的NON-CORS情况下：

可以使用https://www.srihash.org/计算完整性或者输入控制台（link）：

<script 
        src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"
        integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" 
        crossorigin="use-credentials"></script>

crossorigin - 定义从不同来源的服务器加载资源时使用的选项。（参见CORS：https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS）。它有效地改变了浏览器发送的HTTP请求。如果添加了“crossorigin”属性，则会将 origin：＆lt; ORIGIN＆gt; 键值对添加到HTTP请求中，如下所示。

crossorigin 可以设置为：“anonymous”或“use-credentials”。两者都会导致在请求中添加 origin：。然而，后者将确保检查凭证。标签中没有crossorigin属性将导致发送没有origin的请求：键值对。

以下是从CDN请求“use-credentials”的情况：

{{1}}

如果错误设置了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

Answer 3

从技术上讲，完整性属性可以提供帮助-可以正确验证数据源。也就是说，它仅允许浏览器使用CDN服务器上源文件所请求的数量来验证正确的源文件中的数字。

如果此源已建立加密的哈希值，并且已检查其是否符合浏览器中的预定义值，则需要进行进一步的处理-代码将执行，并且用户请求将得到成功处理。

Crossorigin属性可帮助开发人员优化CDN性能的速率，同时保护网站代码免受恶意脚本的侵害。

尤其是，Crossorigin以匿名方式下载站点的程序代码，而无需下载cookie或执行身份验证过程。这样，当您首次将站点加载到特定的CDN服务器上时，它可以防止用户数据泄漏，网络欺诈者可以轻松地替换地址。

来源：https://yon.fun/what-is-link-integrity-and-crossorigin/

什么是完整性和crossorigin属性？

3 个答案: