Preventing DOM Clobbering Attacks: Defenses and Mitigations

August 14, 2023
cybersecuritycertification researchcomptia security+dom clobbering

DOM Clobbering refers to a specific form of injection attack that doesn’t require javascript to be added to implement. In a DOM Clobbering attack, the intention of the attacker is to confuse the client-side JavaScript code of web applications. An attacker can manipulate a segment of non-script HTML markup, when injected into the page it can be executed as code. This manipulation is made possible through the utilization of named property accesses.


What are named properties?

Javascript applications use the Document Object Model (DOM) to manipulate the content of an HTML document. Elements can be targeted with named properties. For example, the “id” or “name” attribute of a tag. These properties are mapped by the browser to the document and window objects. For example <div id=”customDiv”></div> is mapped to window.customDiv and document.customDiv


How can named properties be used in attacks?

If an application is using variables stored globally in the window or document object, they may be overwritten by DOM Clobbering. For example a configuration variable kept at window.customConfig may be overwritten by injecting <div id=”customConfig” item=”newValue”></div>. The application is then vulnerable where customConfig and the overwritten values are used.


Defenses and Mitigation

Secure Coding Patterns

One effective approach is the implementation of namespace isolation. This technique revolves around the separation of namespaces between named properties and JavaScript variables. You can implement separation by prefixing strings to the 'id' and 'name' properties of dynamically inserted DOM elements so they don’t risk collisions. Prefixing 'id' and 'name' properties with specific identifiers adds an additional layer of differentiation, ensuring that these attributes remain distinct from JavaScript variables.

Objects can also be frozen using Object.freeze() if you’re using a global variable. This can prevent the object from being overwritten. However, depending on the size of the application it may not be feasible.


HTML Sanitization

Another approach is to sanitize the HTML input from users by removing “name” and “id” properties from tags. This is application dependent, be sure that the application doesn’t need these values to function properly.


Content Security Policy (CSP)

This should be set in general as a security measure. In the context of DOM Clobbering a well written CSP can prevent some attacks from loading external javascript. However, depending on the application code and how the overwritten variable is used it may be possible to bypass the CSP. For instance, scenarios where dynamic code evaluation constructs like 'eval' or 'new Function()' have their parameters tampered with, fall into this category. Such manipulation can potentially pave the way for Cross-Site Scripting (XSS) that circumvents CSP restrictions.