Courses 🛡️ Blue Team Playbook: Defending Against XSS

[dEEpEst]

Blue Team Playbook: Defending Against XSS​

This post was created for Hack Tools Dark Community

Cross-Site Scripting (XSS) is one of the most persistent web threats. While attackers evolve with new vectors like DOM clobbering, prototype pollution, and postMessage abuse — defenders must stay ahead by applying layered, modern defenses.

This Blue Team guide covers everything you need to prevent, detect, and mitigate XSS vulnerabilities in your web applications.

1. Sanitize and Escape All User Input​

Never trust client input — sanitize and encode everything.

Escape before output:
Use context-aware escaping:
- HTML: escape `< > " ' &`
- JavaScript: escape `' " \ /`
- URL: encodeURIComponent
- CSS: hex encoding

Use a strong sanitizer like DOMPurify:

let clean = DOMPurify.sanitize(userInput);
document.body.innerHTML = clean;

Avoid:
innerHTML, document.write, eval(), setTimeout("code"), `new Function()` unless absolutely needed.

2. Enforce a Strong Content Security Policy (CSP)​

CSP restricts the execution of scripts and external content.

Minimum safe baseline:

Content-Security-Policy: default-src 'self'; script-src 'self'; object-src 'none'; base-uri 'none';

Optional Enhancements:
- Use nonce-based CSP for inline scripts
- Set script-src 'strict-dynamic' to block unknown scripts
- Use report-uri or report-to to log violations

3. Enable Trusted Types (TT)​

Trusted Types is a modern browser defense that blocks DOM-based XSS by requiring safe wrappers for risky sinks like `innerHTML`.

Content-Security-Policy: require-trusted-types-for 'script';

In code:
Use libraries like DOMPurify with TT support:

DOMPurify.sanitize(input, {RETURN_TRUSTED_TYPE: true});

4. Secure Framework Usage (React, Vue, Angular)​

Modern frameworks have built-in XSS protections — but only if used correctly.

React:
- Avoid dangerouslySetInnerHTML
- Use `props.children` and JSX expressions safely

Vue:
- Avoid v-html unless using sanitized content
- Escape all interpolated input in templates

Angular:
- Never use bypassSecurityTrustHtml() unless it's sanitized
- Use built-in sanitizers and template context awareness

5. Protect Against DOM Clobbering & Prototype Pollution​

DOM Clobbering Mitigation:
- Never access form inputs via global names
- Always use `getElementById()` or `querySelector()`
- Avoid setting `innerHTML` directly from URL/query

Prototype Pollution Mitigation:
- Patch libraries like `lodash`, `deepmerge`, `jQuery`
- Block keys like `__proto__`, `constructor`, `prototype`
- Validate all object keys from user-controlled data

6. Sandbox and Control iframe Behavior​

Iframe sandboxing tips:
- Use sandbox="allow-scripts" without `allow-same-origin`
- Sanitize srcdoc content
- Use CSP: frame-ancestors 'none' to block framing

7. Use Secure Cookies​

Cookies used for authentication should be protected from theft via JS.

Example header:

Set-Cookie: session=xyz; HttpOnly; Secure; SameSite=Strict

- HttpOnly: blocks JS access to cookie
- Secure: only sent over HTTPS
- SameSite=Strict: prevents CSRF via third-party requests

8. Monitor & Detect Attacks​

CSP Violation Reporting:
Log script violations to detect XSS attempts:

Content-Security-Policy: ...; report-uri /csp-report

Use security headers:

X-XSS-Protection: 0
Referrer-Policy: strict-origin-when-cross-origin
Permissions-Policy: script-src 'self'

Analyze logs:
Watch for suspicious parameters, encoding, or DOM anomalies in requests.

9. Perform Regular Security Testing​

Use automated scanners (Burp Suite, ZAP, XSStrike)
Perform manual XSS testing across contexts
Audit third-party scripts and libraries

Final Thoughts​

XSS isn't going away — it’s evolving. Defending against it means going beyond escaping text. You need layered defenses: sanitization, strong CSP, trusted types, modern frameworks, sandboxing, and active monitoring.

What’s your favorite XSS defense or hardening technique? Share your insights and let’s build stronger apps together.​