Hush Line Security Spotlight: Subresource Integrity (SRI)

Ensuring tamper-proof content for your web applications

Science & Design
4 min readFeb 17, 2024

Hush Line, our anonymous tip line-as-a-service platform, serves users across industries, from journalism and education to business. We do a lot to ensure our users can trust our app, from hardened content security policies, Tor support, HTTPS with Let’s Encrypt, input sanitation, encryption at rest, E2EE messages, two-factor authentication, and more.

One recent feature we included is Subresource Integrity or SRI. SRI is a security feature that provides several concrete benefits for web security by ensuring that files fetched from external servers (like JavaScript and CSS files) are delivered to the browser without being tampered with.

Implementing SRI for your web application is easy. The basic idea is that you create a hash of a file and use that hash in your application’s markup. If the content served doesn’t match the hash you’ve included, the resource won’t load. Why is this important for Hush Line? We rely on JavaScript for functionality that involves encrypting and decrypting data. In our JS, we’ve integrated support for Mailvelope, an application for decrypting your PGP messages directly in the browser, and for OpenPGP.js — allowing us to encrypt your message before it leaves your computer so our servers never see unencrypted content.

Integrating SRI

In our example, we want to hash our JavaScript file. First, we navigate to the directory with our file, and execute:

openssl dgst -sha384 -binary script.js | openssl base64 -A

It’ll provide a hash that looks like this:

2Adak2DWMJ/1DUQvP6oQALgo4qri9lsut2HXJbvNIHP7jS/XasxcTC/cHR8iEICN

Finally, in our HTML, where we include our scripts, we’ll use the integrity attribute to include the hash:

<script src="{{ url_for('static', filename='script.js') }}" integrity="sha384-2Adak2DWMJ/1DUQvP6oQALgo4qri9lsut2HXJbvNIHP7jS/XasxcTC/cHR8iEICN" crossorigin="anonymous"></script>

If the contents of script.js change, it won’t match the hash provided, and the browser will block the file from loading 💪.

Here are the key benefits SRI provides:

1. Protection Against Content Tampering

SRI helps protect websites from attackers who might try to compromise the content of external scripts or stylesheets. By validating resources against a known cryptographic hash, SRI ensures that the content hasn’t been altered in transit, whether by a man-in-the-middle attack, a compromised CDN, or other malicious interference.

2. Mitigation of Certain Attack Vectors

It significantly reduces the risk associated with several attack vectors, including:

  • Cross-Site Scripting (XSS): By ensuring that only the intended scripts run, it makes it harder for attackers to execute malicious scripts on your page.
  • Man-in-the-Middle (MitM) Attacks: Even if an attacker can intercept the connection to load a script or stylesheet, they can’t alter the content without causing the resource to be blocked by the browser.

3. Enhanced Trust in External Resources

Websites often rely on external libraries and resources hosted on CDNs for functionality and efficiency. SRI boosts confidence in using these resources by ensuring that they are exactly as the developer intended, free from unauthorized modifications.

4. Compliance with Security Policies and Standards

For organizations subject to various compliance requirements, implementing SRI can be a part of meeting those obligations. It demonstrates a commitment to maintaining a secure web environment and protecting user data.

5. Improved Website Integrity and User Safety

By preventing the execution of tampered resources, SRI directly contributes to the overall integrity of the website and the safety of its users. Users can interact with the site, knowing that the scripts and styles they’re loading are secure and as intended by the website developers.

6. Ease of Implementation

Adding SRI to a website is relatively straightforward. Developers can generate hashes for their resources and include them in the HTML with the integrity attribute. This low-effort, high-reward strategy makes SRI an attractive option for enhancing web security.

Implementation Considerations

While SRI offers substantial security benefits, it’s important to manage its implementation effectively:

  • Automate Hash Generation: For dynamic or frequently updated resources, automate the generation of integrity hashes as part of your build or deployment process.
  • Handle External Updates Carefully: If an external resource like a library or a CDN-hosted file is updated, you’ll need to update the corresponding hash in your HTML to prevent resource loading errors.
  • Fallback Mechanisms: Consider implementing fallback mechanisms for critical resources. If an SRI check fails (e.g., due to a hash mismatch), you might want to load an alternative version of the resource that’s hosted on your servers.

In conclusion, Subresource Integrity is a powerful tool for web developers aiming to secure their sites from tampering and other malicious modifications to external resources. Its straightforward implementation, coupled with the significant security benefits it provides, makes it an essential part of modern web security practices.

Have you used SRI in your web applications? Let us know on Mastodon!

--

--

Science & Design
Science & Design

Written by Science & Design

👋 We’re a non-profit design and software development organization. Let’s make something great together! https://scidsg.org

No responses yet