The integrity
property for scripts and stylesheets:
- https://caniuse.com/subresource-integrity
- https://w3c.github.io/webappsec-subresource-integrity/
- https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity
<!-- External scripts -->
<script integrity="sha512-aaaaaaaaa" crossorigin="anonymous" src="script.js"></script>
<!-- External stylesheets -->
<link integrity="sha512-aaaaaaaaa" crossorigin="anonymous" href="styles.css" rel="stylesheet">
<!-- Inline stylesheets -->
<style integrity="style-src www.example.com 'sha512-aaaaaaaaa'">
body { ... }
</style>
You can have multiple hashes separated by a space, but the browser uses the highest
so you might as well use only one (preferably sha-512
like Github).
Node uses crypto:
import {createHash} from "crypto";
const contents = Buffer.from("CONTENTS OF THE FILE");
const integrity = "sha512-" + createHash("sha512").update(contents).digest().toString("base64");
PHP uses hash:
$contents = file_get_contents("script.js");
$integrity = 'sha512-' . base64_encode(hash("sha512", $contents, true));
Plugins to inject integrity in HTML pages:
- for Webpack: webpack-subresource-integrity
- for Rollup: rollup-plugin-sri
More tools:
Also related: