Researchers Bypassed Content Security Policy using HTML-injection Technique

A recent security write-up has exposed a practical method for bypassing nonce-based Content Security Policy (CSP) protections, challenging a key pillar of modern web application defense against cross-site scripting (XSS) attacks.

The technique exploits the interaction between browser caching mechanisms—specifically, the disk cache and the back/forward cache (bfcache)—and the way CSP nonces are handled in real-world applications.

Nonce-based CSPs work by generating a unique, unpredictable value (the nonce) for each page load, which is then required for any inline script to execute.

This mechanism is designed to prevent attackers from injecting and running unauthorized scripts, even if they manage to inject HTML into the page.

However, the new bypass hinges on two main preconditions:

• The attacker must be able to leak the nonce using HTML injection, such as through a <style> or <link rel="stylesheet"> tag.
• The injected HTML payload must be able to change independently from the nonce, for example, via a fetch request that updates part of the page asynchronously.

Exploiting CSS Injection and Disk Cache

The attack unfolds in several steps:

• Leaking the Nonce: By exploiting a CSS injection vulnerability, the attacker crafts selectors that match the nonce value embedded in a <meta> tag (used for CSP in many applications).
• Clever use of CSS attribute selectors and background image requests allows the attacker to exfiltrate the nonce, character by character, to their server.
• Manipulating the Cache: Once the nonce is known, the attacker uses a Cross-Site Request Forgery (CSRF) vulnerability to update the victim’s session or profile with a malicious payload containing the stolen nonce.
• The key insight is that by manipulating browser navigation (using history and window references), the attacker can force the browser to load an old cached version of the page (with the now-known nonce) from disk cache, while simultaneously updating the dynamic content (such as a user profile) with the XSS payload.

This combination allows the injected script—now bearing the correct nonce—to execute, bypassing the CSP’s intended protection.

The attack is made possible by subtle browser behaviors: disk cache can serve stale HTML with a previously valid nonce, while asynchronous requests (like fetches) can be updated to deliver new, attacker-controlled content.

Implications and Best Practices

This research highlights that even well-configured nonce-based CSPs can be undermined if caching and injection points are not carefully considered.

Developers are urged to:

• Avoid reflecting nonces in HTML where CSS selectors can access them.
• Ensure that dynamic content and nonces are tightly coupled and not separately cacheable.
• Regularly test CSP effectiveness and review browser cache behaviors in their threat models.

The findings serve as a reminder that security is only as strong as its weakest link—and that browser internals, like caching, can have unexpected security implications.

Find this Story Interesting! Follow us on LinkedIn and X to Get More Instant updates