What are the integrity and crossorigin attributes?

html cross-domain cors subresource-integrity
New user picture New user · Aug 16, 2015 · Viewed 120.9k times · Source

Bootstrapcdn recently changed their links. It now looks like this:

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

What do the integrity and crossorigin attributes mean? How do they affect the loading of the stylesheet?

Answer

jim.taylor.1974 picture jim.taylor.1974 · Aug 17, 2015

Both attributes have been added to Bootstrap CDN to implement Subresource Integrity.

Subresource Integrity defines a mechanism by which user agents may verify that a fetched resource has been delivered without unexpected manipulation Reference

Integrity attribute is to allow the browser to check the file source to ensure that the code is never loaded if the source has been manipulated.

Crossorigin attribute is present when a request is loaded using 'CORS' which is now a requirement of SRI checking when not loaded from the 'same-origin'. More info on crossorigin

More detail on Bootstrap CDNs implementation

Related questions

How do I use Access-Control-Allow-Origin? Does it just go in between the html head tags?

I've been reading about Access-Control-Allow-Origin because it seems effective at allowing cross domain requests since I have access to the external site. My question ism how do I use Access-Control-Allow-Origin to allow cross domain requests. I tried this (don't laugh) (…

Read More
cross-domain iframe resize

How do I resize an iframe from another domain -Edit Scroll down for some solutions.. or read on how NOT to do this :D After many hours of code hacking- the conclusion is that anything inside the iframe is not …

Read More
Why does canvas.toDataURL() throw a security exception?

Did I not get enough sleep or what? This following code var frame=document.getElementById("viewer"); frame.width=100; frame.height=100; var ctx=frame.getContext("2d"); var img=new Image(); img.src="http://www.ansearch.com/images/interface/item/small/image.…

Read More