Cross-Site Scripting (XSS)

Cross-Site Scripting (XSS) is a vulnerability that allows an attacker to inject malicious scripts into web pages viewed by other users. This script can then execute within the victim's browser context.

Attack Simulation

Comments Section

Alice

Great article!

Bob

Thanks for sharing.

Interactive: Try posting a comment. Then use "Inject Script" to see what happens when the application doesn't sanitize input.

Types of XSS

StoredThe malicious script is permanently stored on the target server (e.g., in a database via a comment field) and served to visitors.
ReflectedThe malicious script is reflected off the web server, such as in an error message or search result, often via a malicious link.
DOM-basedThe vulnerability exists in client-side code rather than server-side code.

Prevention & Defense

Escape User InputConvert special characters into HTML entities (e.g., < becomes <) so the browser renders them as text, not code.

Content Security Policy (CSP)An HTTP header that allows site operators to restrict the resources (like scripts) that can be loaded on a page.

Secure Code Challenge

PATCH_THE_VULNERABILITY

Vulnerable Code

// Vulnerable React Component
function Comment({ text }) {
  // Dangerously rendering user input directly as HTML
  return <div dangerouslySetInnerHTML={{ __html: text }} />;
}

Identify the security flaw above and select the correct patch to fix it.

Select the Secure Implementation