SRI

Options See on deno.land

algorithm sha256 sha384 sha512

The algorithm used to calculate the cryptographic hash of the file

Default:

"sha384"

crossorigin anonymous use-credentials

The CORS setting for the file being loaded

Default:

"anonymous"

selector string

The selector to find the elements to add the integrity attribute

Default:

"script[src], link[rel=stylesheet][href]"

Description

SRI (Subresource Integrity) is a browser feature to protect your site and your users from compromised code loaded from external CDN. It verifies the code loaded by the browser is exactly the same code that you got during the build process, without unexpected manipulations. You can learn more about SRI in the MDN article.

The plugin searches for <script> and <link rel="stylesheet"> elements in your pages that load resources from other domains and add the integrity and crossorigin attributes automatically. For example, if you have this code:

<script src="https://code.jquery.com/jquery-3.7.0.slim.min.js"></script>

The plugin outputs the following:

<script
  src="https://code.jquery.com/jquery-3.7.0.slim.min.js"
  integrity="sha256-tG5mcZUtJsZvyKAxYLVXrmjKBVLd6VpVccqz/r4ypFE="
  crossorigin="anonymous"
></script>

Installation

Import this plugin in your _config.ts file to use it:

import lume from "lume/mod.ts";
import sri from "lume/plugins/sri.ts";

const site = lume();

site.use(sri(/* Options */));

export default site;