Subresource Integrity (SRI) is a security feature that enables browsers to verify that files they fetch (for example, from a CDN) are delivered without unexpected manipulation. It works by allowing you to provide a cryptographic hash that a fetched file must match.
How Subresource Integrity helps
Using Content Delivery Networks (CDNs) to host files such as scripts and stylesheets that are shared among multiple sites can improve site performance and conserve bandwidth. However, using CDNs also comes with a risk, in that if an attacker gains control of a CDN, the attacker can inject arbitrary malicious content into files on the CDN (or replace the files completely) and thus can also potentially attack all sites that fetch files from that CDN.
The Subresource Integrity feature enables you to mitigate the risk of attacks such as this, by ensuring that the files your Web application or Web document fetches (from a CDN or anywhere) have been delivered without a third-party having injected any additional content into those files — and without any other changes of any kind at all having been made to those files.
Using Subresource Integrity
You use the Subresource Integrity feature by specifying a base64-encoded cryptographic hash of a resource (file) you’re telling the browser to fetch, in the value of the integrity attribute of any
An integrity value begins with at least one string, with each string including a prefix indicating a particular hash algorithm (currently the allowed prefixes are
sha512), followed by a dash, and ending with the actual base64-encoded hash.
An integrity value may contain multiple hashes separated by whitespace. A resource will be loaded if it matches one of those hashes.
Example integrity string with base64-encoded sha384 hash:
An integrity value’s “hash” part is, strictly speaking, a cryptographic digest formed by applying a particular hash function to some input (for example, a script or stylesheet file). But it’s common to use the shorthand hash to mean cryptographic digest, so that’s what’s used in this article.
Tools for generating SRI hashes
You can generate SRI hashes from the command-line with openssl using a command invocation such as this:
cat FILENAME.js | openssl dgst -sha384 -binary | openssl enc -base64 -A
Additionally, the SRI Hash Generator at https://srihash.org/ is an online tool you can use to generate SRI hashes.
In the following examples, assume that
oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC is already known to be the expected SHA-384 hash (digest) of a particular script
example-framework.js, and there’s a copy of the script hosted at
Example: Subresource Integrity with the script element
You can use the following
<script> element to tell a browser that before executing the
https://example.com/example-framework.js script, the browser must first compare the script to the expected hash, and verify that there’s a match.
<script src="https://example.com/example-framework.js" integrity="
For more details on the purpose of the crossorigin attribute, see CORS settings attributes.
How browsers handle Subresource Integrity
Browsers handle SRI by doing the following:
- When a browser encounters a
<link>element with an integrity attribute, before executing the script or before applying any stylesheet specified by the
<link>element, the browser must first compare the script or stylesheet to the expected hash given in the integrity value.
- If the script or stylesheet doesn’t match its associated integrity value, then the browser must refuse to execute the script or apply the stylesheet, and must instead return a network error indicating that fetching of that script or stylesheet failed.
|Feature||Chrome||Firefox (Gecko)||Internet Explorer||Opera||Safari|
|The integrity attribute for
||45.0||43 (43)||No support||32||No support |
|Feature||Chrome for Android||Firefox Mobile (Gecko)||IE Mobile||Opera Mobile||Safari Mobile|
|The integrity attribute for
||45.0||43.0 (43)||No support||No support||No support |