DOM Clobbering
MediumDOM Clobbering
Definition
DOM Clobbering is a web attack technique where the attacker injects HTML elements that overwrite global properties of the JavaScript DOM. Using attributes such as id or name on HTML elements, global references are created that can replace variables, objects or functions the JavaScript code expects, altering its behavior.
Impact
Cross-Site Scripting (XSS) in contexts where HTML injection is allowed but scripts are notBypassing HTML sanitizers such as DOMPurifyAltering the JavaScript execution flowRedirection to malicious URLs
Examples
DOM Clobbering to overwrite a global variable
HTML elements with an id attribute create global properties on window. If the app's JavaScript uses a global variable that matches the injected id, the HTML element overwrites it, letting the attacker control its value.
<!-- The application's JavaScript code -->
<script>
// The app expects 'config' to be an object defined in another script
if (typeof config !== 'undefined') {
fetch(config.apiUrl + '/data');
}
</script>
<!-- The attacker injects (in a field that allows HTML but not <script>) -->
<a id="config" href="https://evil.com/"></a>
<!-- Now config.toString() returns "https://evil.com/"
and the app fetches https://evil.com//data -->