SecureStartKit
Vulnerability Patterns

XSS(Cross-Site Scripting)

Also known as: Cross-Site Scripting, stored XSS, reflected XSS

Definition

XSS (Cross-Site Scripting) is a vulnerability where attacker-controlled content reaches a page and executes as JavaScript in the victim's browser. React mitigates XSS by default through JSX escaping, but the raw-HTML escape-hatch prop, raw HTML in MDX, and trusted-data assumptions still create injection paths.

What is XSS?

XSS happens when user input or other untrusted data is rendered into HTML without escaping, and the rendered output contains a <script> tag or an event handler attribute that the browser executes. The attacker's script then runs in the victim's session and can read cookies, exfiltrate data, or make authenticated requests.

How does React prevent XSS by default?

JSX automatically escapes <, >, &, ", and ' when rendering text values. Writing <div>{userInput}</div> is safe even if userInput contains a script tag. The escape pass turns the tag into harmless text. The exception is React's prop for injecting raw HTML strings, which intentionally bypasses escaping and must never be used on user-controlled values.

What is a nonce-based CSP?

A defense-in-depth layer. Even if XSS injects a <script> tag, the browser refuses to execute it unless the tag carries a server-generated nonce that matches the CSP header. A Routing Middleware generates the nonce per request, the server-rendered tags include it, and attacker-injected tags lack it. This is the architectural fix recommended in the 12-step hardening checklist.

Learn more

Related terms

← Back to full glossary