Skip to content

Content Security Policy and SRI

Run the widget under a strict CSP, and pin the CDN file with Subresource Integrity.

On this page

The widget needs no unsafe-inline and no unsafe-eval.

Content Security Policy

It injects two style tags, so pass their nonce, and the large cursor is a data: SVG image. Leave out the CDN host when you bundle the package. CI runs the widget under default-src 'none' with Trusted Types and fails on any violation.

Terminal
Content-Security-Policy: script-src 'self' https://cdn.jsdelivr.net;
  style-src 'self' 'nonce-RANDOM'; img-src 'self' data:; require-trusted-types-for 'script'
TypeScript
A11yWidget.init({ nonce: "RANDOM" }); // the same per-response nonce as in the header

Subresource Integrity

@1 on the CDN follows every 1.x release, so it can't carry an integrity hash. For production, pin an exact version with its hash: the browser refuses the file if the CDN ever serves something else. Compute the hash yourself or copy it from the file's page on jsdelivr.com, and update both when you upgrade.

HTML
<script src="https://cdn.jsdelivr.net/npm/open-accessibility-widget@1.4.1/dist/open-accessibility-widget.global.js"
        integrity="sha384-dO9rT4vwimvvXQt0APugeYB/UVAs+WxY4DskABQA/kETXVreihc0vfYY0S0lSW9G" crossorigin="anonymous"></script>
Terminal
curl -s https://cdn.jsdelivr.net/npm/open-accessibility-widget@<version>/dist/open-accessibility-widget.global.js \
  | openssl dgst -sha384 -binary | openssl base64 -A

Trusted Types

The widget builds its interface with createElement and never assigns HTML strings, so it works under require-trusted-types-for 'script' with no policy of its own.

Edit this page on GitHub