Goodbye innerHTML, Hello setHTML: Stronger XSS Protection in Firefox 148 – Mozilla Hacks

Cross-site scripting (XSS) remains one of the most prevalent vulnerabilities on the web. The new standardized sanitizer API provides web developers with a straightforward way to sanitize untrusted HTML before it is inserted into the DOM. Firefox 148 is the first browser to ship this standardized security enhancement API, furthering a safer web for everyone. We expect other browsers to follow suit soon.

An XSS vulnerability occurs when a website inadvertently allows attackers to inject arbitrary HTML or JavaScript through user-generated content. With this attack, an attacker can monitor and manipulate user interactions and continually steal user data as long as the vulnerability remains exploitable. XSS has a long history of being extremely difficult to prevent and has been ranked in the top three web vulnerabilities (CWE-79) for almost a decade.

sanitizer diagram optimized 2Firefox has been deeply involved in solutions to XSS from the beginning, starting with the pioneering of the Content-Security-Policy (CSP) standard in 2009. CSP allows websites to restrict what resources (scripts, styles, images, etc.) the browser can load and execute, providing a strong line of defense against XSS. Despite a steady stream of improvements and ongoing maintenance, CSP has not gained sufficient acceptance for protecting the long tail of the Web because it requires significant architectural changes to existing Web sites and constant review by security experts.

The Sanitizer API is designed to help fill that gap by providing a standardized way to transform malicious HTML into harmless HTML – in other words, to sanitize it. setHTML() The method integrates sanitization directly into the HTML entry, providing security by default. Here’s an example of sanitizing a simple unsafe HTML:

document.body.setHTML(`

This will allow sanitization HTML When removing embedded elements element and its onclick The feature, which eliminated the XSS attack resulting in the following secure HTML:

Developers can opt for stronger XSS protection with minimal code changes by replacing error-prone internal HTML assignments with setHTML(). Default configuration of if setHTML() is too strict (or not strict enough) for a given use case, developers can provide a custom configuration that defines which HTML elements and attributes should be kept or removed. To experiment with the Sanitizer API before introducing it on a web page, we recommend exploring the Sanitizer API Playground.

For even stronger security, the sanitizer API can be combined with trusted types, centralizing control over HTML parsing and injection. Once setHTML() Adopted, sites can more easily enable trusted type enforcement, often without the need for complex custom policies. A strict policy may allow setHTML() Helps prevent future XSS regressions, while blocking other insecure HTML entry methods.

Sanitizer API enables easy replacement Of inner html assignment with setHTML() In the existing code, a new secure default has been introduced to protect users from XSS attacks on the web. Firefox 148 supports the Sanitizer API as well as trusted types, creating a secure web experience. Adoption of these standards will allow all developers to prevent XSS without the need for a dedicated security team or significant implementation changes.


Image credit for the above illustration: Website, by Desi Ratna; The individual, created by the created; Hacker by Andy Horvath.

More articles by Tom Schuster…
Friedrich Braun creates security for the web and Mozilla Firefox from Berlin. As a standards contributor, Frederick is also improving the web platform by bringing security by default with specifications like the Sanitizer API and Subresource Integrity. When not at work, Frederick loves reading a good novel or going on long bike trips across Europe.
More articles by Frederick Braun…
Manager, Security Engineering
More articles by Christoph Kerschbaumer…



<a href

Leave a Comment