Subresource Integrity Basics

Introduction

Welcome to the very first lesson of the "Web Resource Integrity and Secure Configuration" course! 🎉 In this lesson, we will explore Subresource Integrity (SRI), a crucial web security feature that helps protect your applications from malicious code injections. By the end of this lesson, you'll understand how SRI works and how to implement it to ensure the integrity of your web resources.

Understanding Subresource Integrity (SRI)

Let's return to the data integrity concept. In previous courses, we explored: File integrity verification : Using checksums and hashes to verify that files haven't been tampered with during storage or transfer Request parameter validation : Ensuring that user inputs match expected formats and aren't manipulated Data integrity in databases : Implementing constraints and validation to maintain accurate data What we've learned in those courses establishes the foundation for understanding integrity: data should remain unchanged and verifiable throughout its lifecycle. However, those courses primarily focused on server-side integrity mechanisms. What we didn't cover was how to extend these integrity principles to the client side, particularly for web resources loaded by browsers. This is where Subresource Integrity (SRI) comes in. Subresource Integrity (SRI) is a security feature that allows web browsers to verify that resources like scripts and stylesheets have not been tampered with. It does this by using cryptographic hashes. When a resource is loaded, the browser checks its hash against the expected hash. If they match, the resource is considered safe; if not, the browser blocks it. This mechanism is particularly useful when loading resources from third-party sources, as it ensures that the content has not been altered by an attacker. By implementing SRI, you can enhance the security of your web applications and protect users from potential threats.

The Vulnerable Code

Let's examine a scenario in which a web application is vulnerable due to the absence of SRI. Imagine a situation where your website loads a script from a third-party server without verifying its integrity. This lack of verification can lead to security risks. HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Vulnerable Example</title> <link rel="stylesheet" href="/static/styles.css"> </head> <body> <h1>Hello, World!</h1> <script src="https://cdn.example.com/framework.js"></script> </body> </html> In this code, the stylesheet is loaded from /static/styles.css, and the script is loaded from a third-party server without any integrity checks. If the third-party server is compromised, an attacker could modify the script, and your website would unknowingly execute the malicious code.

Join the 1M+ learners on CodeSignal

Be a part of our community of 1M+ users who develop and demonstrate their skills on CodeSignal

Generating SRI Hashes

To protect your web application, you can implement SRI by generating cryptographic hashes for your resources. Let's walk through the process of generating an SRI hash using Java.

Java

import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Paths;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.util.Base64;

public class SRIHashGenerator {
    public static String generateSRIHash(String filePath) throws IOException, NoSuchAlgorithmException {
        // Read the file content as bytes
        byte[] fileContent = Files.readAllBytes(Paths.get(filePath));
        
        // Compute the hash and encode it in Base64
        MessageDigest digest = MessageDigest.getInstance("SHA-384");
        byte[] hashBytes = digest.digest(fileContent);
        String hashBase64 = Base64.getEncoder().encodeToString(hashBytes);

        // Return the SRI hash string
        return "sha384-" + hashBase64;
    }

    public static void main(String[] args) {
        try {
            String sriHash = generateSRIHash("src/main/resources/static/js/main.js");
            System.out.println("SRI Hash: " + sriHash);
        } catch (IOException | NoSuchAlgorithmException e) {
            e.printStackTrace();
        }
    }
}

import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Paths;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.util.Base64;

public class SRIHashGenerator {
    public static String generateSRIHash(String filePath) throws IOException, NoSuchAlgorithmException {
        // Read the file content as bytes
        byte[] fileContent = Files.readAllBytes(Paths.get(filePath));
        
        // Compute the hash and encode it in Base64
        MessageDigest digest = MessageDigest.getInstance("SHA-384");
        byte[] hashBytes = digest.digest(fileContent);
        String hashBase64 = Base64.getEncoder().encodeToString(hashBytes);

        // Return the SRI hash string
        return "sha384-" + hashBase64;
    }

    public static void main(String[] args) {
        try {
            String sriHash = generateSRIHash("src/main/resources/static/js/main.js");
            System.out.println("SRI Hash: " + sriHash);
        } catch (IOException | NoSuchAlgorithmException e) {
            e.printStackTrace();
        }
    }
}

In this code, we use Java's MessageDigest to read the content of a file and generate a SHA-384 hash. The hash is then encoded in Base64 using Base64.getEncoder(). The resulting string can be used as the integrity attribute in your HTML, ensuring that the resource has not been altered.

Introduction

Understanding Subresource Integrity (SRI)

The Vulnerable Code

Join the 1M+ learners on CodeSignal

Exploiting the Vulnerability

What is Hashing and Why Does It Matter?

Generating SRI Hashes

Adding SRI to HTML

SRI Injection Attacks

Real-World Scenarios and Benefits of SRI

Conclusion and Next Steps