# Source: https://rsbuild.dev/config/security/sri.md

# security.sri

* **Type:**

```ts
type SriAlgorithm = 'sha256' | 'sha384' | 'sha512';

type SriOptions = {
  enable?: 'auto' | boolean;
  algorithm?: SriAlgorithm | SriAlgorithm[];
};
```

* **Default:** `undefined`

Adds an `integrity` attribute to `<script>` and `<link>` tags injected into HTML so the browser can verify the resource's integrity and prevent tampering.

> `security.sri` is implemented based on Rspack's [SubresourceIntegrityPlugin](https://rspack.rs/plugins/rspack/subresource-integrity-plugin)

## What is SRI

Subresource Integrity (SRI) is a security feature that enables browsers to verify that resources they fetch (for example, from a CDN) arrive without unexpected manipulation. It works by letting you provide a cryptographic hash that a fetched resource must match.

If the hash does not match, script tags are blocked from running and stylesheet links are not loaded.

For more on subresource integrity, see [Subresource Integrity - MDN](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity).

## Example

When using SRI, enable [html.crossorigin](/config/html/crossorigin.md) so resources can be properly validated during cross-origin loading.

```ts title="rsbuild.config.ts"
export default {
  security: {
    sri: {
      enable: 'auto',
    },
  },
  html: {
    crossorigin: 'anonymous',
  },
};
```

:::tip
If you do not set `html.crossorigin`, Rsbuild will automatically set it to `anonymous`.
:::

After enabling `security.sri`, the `<script>` and `<link>` tags generated by Rsbuild will include the `integrity` and `crossorigin` attributes:

```html
<script
  defer
  src="https://cdn.com/static/js/index.js"
  crossorigin="anonymous"
  integrity="sha384-d8fhhhTWXaPPIEMw+POJ9hqCIRvsFbegq/oef7k9R8Rpb8Dy95B2THPOECdZoLDF"
></script>

<link
  href="https://cdn.com/static/css/index.css"
  rel="stylesheet"
  crossorigin="anonymous"
  integrity="sha384-8U9HYzsHbf55cFZyiWIE29+QPYQ9WO+U5uT/ViFw0TOwM2Fbbb74ZegzRV/nvwrD"
/>
```

In addition, the [manifest file](/config/output/manifest.md#sri) generated by Rsbuild will also include an `integrity` field.

## Note

The `security.sri` in Rsbuild will only apply to the tags generated by Rspack and Rsbuild and will not apply to:

* The original tags in the HTML template.
* The tags inserted through client JavaScript code.

Rsbuild will handle the following `<link>` tags:

* `<link rel="preload">`
* `<link rel="stylesheet">`
* `<link rel="modulepreload">`

## Options

### enable

* **Type:** `'auto' | boolean`
* **Default:** `false`

Whether to enable SRI. `'auto'` means it is enabled in production mode and disabled in development mode.

```ts title="rsbuild.config.ts"
export default {
  security: {
    sri: {
      enable: 'auto',
    },
  },
};
```

> Typically, you do not need to enable SRI in development mode.

### algorithm

* **Type:** `SriAlgorithm | SriAlgorithm[]`
* **Default:** `'sha384'`

Specifies the algorithm used to compute the integrity hash.

For example, set to `sha512`:

```ts title="rsbuild.config.ts"
export default {
  security: {
    sri: {
      algorithm: 'sha512',
    },
  },
};
```

The generated value of integrity attribute will be prefixed with `sha512-`:

```html
<script
  defer
  src="https://cdn.com/static/js/index.js"
  crossorigin="anonymous"
  integrity="sha512-ShExVSs5q/j3ZBI/PeS0niJ4mBxh6tc08QN1uofI1dmGAx7ETMh8/VDddGRewxXQhjCgdgAnaiY3BfnWrUSmZA=="
></script>
```

Or configure multiple algorithms:

```ts title="rsbuild.config.ts"
export default {
  security: {
    sri: {
      algorithm: ['sha384', 'sha256'],
    },
  },
};
```

> Reference: [Cryptographic hash functions](https://www.w3.org/TR/SRI/#cryptographic-hash-functions).

## Version history

| Version | Changes                             |
| ------- | ----------------------------------- |
| v1.6.15 | Add support for multiple algorithms |