OWASP Subresource Integrity (SRI) Guide: Securing the Supply Chain
May 17, 2026 | Supply Chain Security | 4 Min. Lesedauer


Auf dieser Seite
- The Anatomy of a Third-Party Breach
- Technical Implementation Standards
- The CORS Requirement
- Security Resilience: With vs Without SRI
- Common Misconceptions
- The Operational Cost of Integrity
- Defense in Depth with CSP
- Resilience: The Local Fallback Pattern
- Step-by-Step Implementation Guide
- When to Avoid SRI
- Authoritative Resources
Lesefortschritt
0%
noch 4 Min.
The Anatomy of a Third-Party Breach
Modern web applications are increasingly composed of third-party assets. From analytics and marketing trackers to UI frameworks and payment processors, the browser fetches code from dozens of external domains. While this modularity accelerates development, it creates a massive attack surface. If a Content Delivery Network (CDN) or a vendor's server is compromised, attackers can inject malicious payloads - such as credit card skimmers (Magecart) or credential harvesters - directly into your users' sessions.
Subresource Integrity (SRI) is a security feature that enables browsers to verify that resources fetched from a CDN or any third-party server are delivered without unexpected manipulation. By providing a cryptographic hash of the expected file, you ensure that the browser only executes the code if it matches your known-good version.
Technical Implementation Standards
Implementing SRI requires two primary attributes on your <script> or <link> tags: integrity and crossorigin. The integrity attribute contains the cryptographic hash, while the crossorigin attribute is mandatory for resources fetched from a different origin to allow the browser to check the hash without violating CORS policies.
Cryptographic Hashes: Use SHA-384 or SHA-512. While SHA-256 is supported, higher bit-depths are recommended by OWASP for long-term collision resistance.
The integrity Attribute: This consists of the hash algorithm prefix followed by the base64-encoded hash value.
The crossorigin Attribute: For CDNs, this must be set to 'anonymous'. This prevents the leakage of user credentials while satisfying the security requirements for integrity checks.
HTTPS Requirement: SRI is only effective over secure connections. If a site is served over HTTP, an attacker can simply strip the SRI attributes from the HTML during transit.
<!-- Standard SRI implementation for a third-party library -->
<script src="https://example-cdn.com/library-v2.1.0.js"
integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"
crossorigin="anonymous"></script>The CORS Requirement
A common reason for SRI failure is incorrect server-side configuration. Because SRI requires the crossorigin attribute, the remote server MUST return a valid Access-Control-Allow-Origin header. If this header is missing or does not include your domain, the browser will block the resource regardless of whether the hash matches.
Security Resilience: With vs Without SRI
The following table illustrates how SRI protects against common supply chain attack vectors compared to standard implementation.
| Attack Scenario | Without SRI | With SRI (Secure Implementation) |
|---|---|---|
CDN Compromise | Attacker injects skimmer; all users affected. | Browser detects hash mismatch and blocks script execution. |
Man-in-the-Middle (MitM) | Code is altered in transit to redirect traffic. | Integrity check fails; malicious code is discarded. |
Accidental Vendor Update | New version introduces a breaking bug or vulnerability. | Browser refuses to load the new, unhashed version. |
Domain Hijacking | Script points to a malicious server. | Resource is blocked unless the hash matches exactly. |
Common Misconceptions
Understanding what SRI does not do is as important as understanding its primary function. A common myth is that SRI replaces Vulnerability Scanning. It does not. SRI ensures you get the exact file you requested, but if that file itself contains a known vulnerability (like an old version of jQuery with an XSS bug), SRI will happily load it because the hash matches.
Another misconception is that SRI is only for JavaScript. It is equally important for CSS files, as malicious CSS can be used for data exfiltration via 'CSS Injection' or to perform UI redressing attacks.
The Operational Cost of Integrity
The primary barrier to SRI adoption is the risk of a site breaking when a vendor updates their code. This is often referred to as the 'Secure but Broken' state. If you implement SRI on a file that the vendor updates without changing the URL, your site will stop working as the browser will block the new version due to the hash mismatch.
To manage this operational cost, version pinning is mandatory. You must never use URLs that point to 'latest.js' or unversioned paths. Always pin to a specific release (e.g., library-v2.1.0.js). This ensures that the file remains immutable and your hash stays valid until you choose to perform a manual update and re-hash of the asset.
Defense in Depth with CSP
SRI should not stand alone. It is most effective when paired with a robust Content Security Policy (CSP). While the experimental require-sri-for directive was originally proposed to mandate SRI, it has been deprecated and is not supported in modern browsers. Instead, security teams should focus on strict script-src and style-src directives to limit the domains that can serve code to your application.
Content-Security-Policy: default-src 'self'; script-src 'self' https://trusted-cdn.com; style-src 'self' https://trusted-cdn.com;Resilience: The Local Fallback Pattern
In production environments, blocking a script due to an integrity failure can break critical user flows. To prevent this, elite engineering teams implement a 'Local Fallback' pattern. This involves attempting to load the script from a CDN with SRI, and if the object is missing (due to a hash mismatch), immediately loading a local, trusted copy of the same library.
<!-- Load from CDN with SRI -->
<script src="https://cdn.example.com/jquery-3.6.0.min.js"
integrity="sha384-vtXRMe3mGCbOeY7l30aIg8H9p3GdeSe4IFlP6G8JMa7o7lXvnz3GFKzPxzRLWQm"
crossorigin="anonymous"></script>
<!-- Fallback to local copy if CDN load fails -->
<script>window.jQuery || document.write('<script src="/js/vendor/jquery-3.6.0.min.js"><\/script>')</script>Step-by-Step Implementation Guide
Inventory
Identify all third-party scripts and styles loaded from external domains.
Version Pinning
Ensure every resource is requested via a version-specific URL.
Hash Generation
Generate hashes using tools like openssl or the SRI Hash Generator.
Integration
Update your HTML tags with the integrity and crossorigin attributes.
Validation
Verify implementation using browser dev tools to ensure no scripts are being blocked due to hash mismatches.
Automation
Integrate SRI hash generation into your build pipeline to handle future updates automatically.
When to Avoid SRI
SRI is designed for static assets. It should not be used for dynamic or session-based scripts. If a server generates a different JavaScript file for every user (e.g., including a personalized token in the source code), the hash will be different every time, and the integrity check will fail. In these cases, security should be managed through Subdomain Isolation or limited CSP scopes instead.
Authoritative Resources
Technical Guidance
Automate Supply Chain Integrity
Manually managing SRI hashes for dozens of third-party scripts is an operational nightmare. SiteWall provides real-time visibility and autonomous protection for your front-end, ensuring your digital supply chain remains secure without the manual overhead.