什么是完整性和交叉源属性?

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属性是什么意思?它们如何影响样式表的加载?

154505 次浏览

这两个属性都已添加到Bootstrap CDN以实现子资源的完整性

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

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

Crossorigin属性在使用“CORS”加载请求时出现,这现在是SRI检查的一个要求,当没有从“同源”加载时。 更多关于交叉基因的信息 < / p >

更多关于Bootstrap cdn实现的详细信息

完整性 -定义资源的哈希值(如校验和),必须匹配才能让浏览器执行它。散列确保文件未被修改,并包含预期的数据。这样浏览器就不会加载不同的(例如恶意的)资源。想象一下这样一种情况,您的JavaScript文件在CDN上被黑客攻击,而且没有办法知道它。完整性属性防止加载不匹配的内容。

无效的SRI将被阻止(Chrome developer-tools),无论跨起源。当完整性属性不匹配时,以下为NON-CORS情况:

enter image description here

完整性可以计算使用: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”属性,它将导致在HTTP请求中添加产地:& lt; ORIGIN>键值对,如下所示。

enter image description here

crossorigin可以设置为" anonymous "或" use-credentials "。两者都会导致将产地:添加到请求中。然而,后者将确保凭证被检查。标签中没有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>

如果交叉源设置不正确,浏览器可以取消请求。

enter image description here

链接

博客

从技术上讲,完整性属性可以帮助实现这一点——它可以正确地验证数据源。也就是说,它只允许浏览器验证正确的源文件中的数字与位于CDN服务器上的源文件请求的数量。

再深入一点,如果这个源的加密散列值已经建立,并且检查了它是否符合浏览器中的预定义值,代码就会执行,用户请求就会被成功处理。

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

其中,Crossorigin以匿名方式下载网站的程序代码,不需要下载cookie,也不需要进行身份验证。这样,当你第一次在特定的CDN服务器上加载网站时,它可以防止用户数据泄露,网络骗子可以很容易地替换地址。

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