DOM-based vulnerabilities Overview

Lab Levels

Jump directly to the lab writeups:

• PRACTITIONER
• EXPERT

Introduction

What is the DOM?

The Document Object Model (DOM) is the browser’s internal representation of a web page. It is a tree-like structure composed of all the HTML elements on the page.

Figure: Example of DOM representation showing the hierarchical structure of HTML elements

JavaScript can access and manipulate the DOM, changing the page’s structure, style, and content dynamically. While this is a powerful feature, improper handling can lead to DOM-based vulnerabilities.

These vulnerabilities occur when attacker-controlled data (source) is passed into a dangerous function or object (sink) without proper validation or sanitization.

---

Taint-Flow Vulnerabilities

Taint-flow vulnerabilities in the DOM stem from unsafe handling of data that flows from untrusted sources to sensitive sinks.

---

What is a Source?

A source is any JavaScript property or object that receives data, typically user-controlled. If an attacker can influence the content of a source, and the application fails to handle it safely, it can be abused.

Common Sources Include:

• location.search – Query string parameters
• location.hash – URL fragment identifier
• document.referrer – Referring page
• document.cookie – User’s cookies
• window.name – Window metadata
• postMessage – Web messages from other origins

These values can often be manipulated directly by an attacker to inject payloads.

---

What is a Sink?

A sink is a function or property that executes or renders data in a way that can be dangerous if the data is not properly sanitized.

Examples of Dangerous Sinks:

• eval() – Executes arbitrary JavaScript code
• document.write() – Injects HTML into the page
• element.innerHTML – Renders raw HTML (possible script injection)
• element.setAttribute() – Sets tag attributes, which may be scriptable (e.g., onerror, href)
• location.href, window.location – Can cause redirects
• setTimeout()/setInterval() – Can execute strings as code

---

DOM Vulnerabilities: Source to Sink

A DOM-based vulnerability arises when data from a source flows into a sink without validation or sanitization, enabling the attacker to control the sink’s behavior.

Example:

// Vulnerable code
let name = location.search.slice(6);  // source
document.body.innerHTML = "<h1>" + name + "</h1>"; // sink

If an attacker accesses the page with ?name=<img src=x onerror=alert(1)>, the payload gets rendered and executed.

---

Common DOM-Based Vulnerabilities and Sinks

The table below summarizes typical DOM vulnerabilities and their associated dangerous sinks.

Figure: Common DOM-based vulnerabilities and corresponding sinks in JavaScript

---