414

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">

integritycrossorigin属性是什么意思?它们如何影响样式表的加载?

4

3 回答 3

265

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

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

完整性属性是允许浏览器检查文件源以确保如果源已被操纵,则永远不会加载代码。

当使用“CORS”加载请求时,会出现跨域属性,这现在是在未从“同源”加载时进行 SRI 检查的要求。 有关跨域的更多信息

有关 Bootstrap CDN 实施的更多详细信息

于 2015-08-17T03:15:56.063 回答
153

完整性- 定义必须匹配以使浏览器执行它的资源的哈希值(如校验和)。哈希确保文件未被修改并包含预期的数据。这样浏览器就不会加载不同的(例如恶意的)资源。想象一下,您的 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”属性 - 它将导致将origin: <ORIGIN>键值对添加到 HTTP 请求中,如下所示。

在此处输入图像描述

crossorigin可以设置为“匿名”或“使用凭据”。两者都会导致将origin:添加到请求中。然而,后者将确保检查凭据。标签中没有 crossorigin 属性将导致发送无源请求:键值对。

这是从 CDN 请求“使用凭据”的情况:

<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>

如果跨域设置不正确,浏览器可以取消请求。

在此处输入图像描述

链接

博客

于 2018-03-02T01:13:08.767 回答
3

从技术上讲,Integrity 属性有助于做到这一点 - 它可以正确验证数据源。也就是说,它仅允许浏览器使用位于 CDN 服务器上的源文件请求的数量来验证正确源文件中的数字。

再深入一点,如果此源的已建立加密哈希值及其与浏览器中预定义值的符合性检查 - 代码将执行,并且用户请求已成功处理。

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

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

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

于 2020-05-27T15:36:23.130 回答