Browsers can use Subresource Integrity (SRI), a security feature, to check that the resources they download (for instance, via a CDN), are provided without unexpected manipulation. It works by allowing you to provide a cryptographic hash that a fetched resource must match.
The rule determines if
integrity value is being defined for any
Subresource integrity, or SRI, is a security feature that allows your browser to distinguish if the files being retrieved have been maliciously altered. The current implementation covers only the two elements outlined in the spec:
<link rel="stylesheet"> elements.
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.
Example integrity string with base64-encoded sha384 hash:
<script src="https://example.com/scripts.js" type="module" integrity="sha384-i2DHGSv8BucNaLXy+qLgUBnq9L/EJOl9bg9doMjaHQGLemlwhmCMdYS+fpdurOAL">
In case when hash doesn’t match then the browsers that support subresource integrity will refuse to load the file because the integrity value doesn’t correspond to the actual
sha384 hash of the file. You’ll see an error message logged in the developer tools console:
Failed to find a valid digest in the 'integrity' attribute for resource 'https://example.com/scripts.js' with computed SHA-384 integrity '/1fX+jQ2iZOn1W5TfeCHqsgVDk+Q7emd985xOiNZ3oI='. The resource has been blocked.
How to fix it
- Attach a unique integrity attribute created using e.g. SHA384. You may use SRI Hash Generator for that purpose.
- Webpack – you may use webpack-subresource-integrity.
- Angular framework – use option
--subresource-integritythat enables the use of subresource integrity validation for Angular.
Best Practices, Security, SiteLint, Version 1.0