Cross-Site Scripting (XSS) remains one of the most common and dangerous security vulnerabilities in web applications. It allows attackers to inject malicious scripts into webpages viewed by other users, potentially leading to stolen data, session hijacking, and compromised user accounts.

In this blog, we will explore what XSS is, its types, the risks it poses, and most importantly, how to protect your web applications from XSS attacks.

What is XSS?

Cross-Site Scripting (XSS) is a security vulnerability that enables attackers to inject malicious client-side scripts (usually JavaScript) into web pages viewed by other users. When these scripts execute, they can perform actions on behalf of the victim, steal sensitive data, or even spread malware.

How Does XSS Work?

An attacker finds a way to insert malicious scripts into input fields or URLs that a web application doesn’t properly sanitize or encode. When another user visits the infected page, the malicious script runs in their browser context.

Types of XSS Attacks

1. Stored (Persistent) XSS
   Malicious script is permanently stored on the target server (e.g., in a database, comment section, or forum post). Every time a user loads the affected page, the script executes.
2. Reflected (Non-persistent) XSS
   Malicious script is embedded in a URL or HTTP request and immediately reflected back by the server in the response. This usually requires the victim to click a crafted link.
3. DOM-based XSS
   The vulnerability exists in client-side scripts that process user input insecurely, manipulating the Document Object Model (DOM) without proper sanitization.

Why is XSS Dangerous?

• Cookie theft: Attackers can steal session cookies, impersonate users, and hijack accounts.
• Credential theft: Malicious scripts can trick users into submitting login credentials to fake forms.
• Malware distribution: Scripts can redirect users to malicious sites or download malware.
• Defacement: Attackers can alter website content and reputation.
• Privilege escalation: Combined with other vulnerabilities, it can lead to deeper system compromises.

How to Protect Against XSS Attacks

1. Input Validation and Sanitization

• Validate user inputs strictly for expected formats.
• Sanitize inputs by removing or escaping potentially dangerous characters like <, >, " , ' , / etc.

Image suggestion: Diagram showing input flow with validation and sanitization steps.

2. Contextual Output Encoding

• Always encode data before rendering it on the page.
• Use proper encoding depending on the output context: HTML, JavaScript, URL, CSS.

For example, HTML-escape user data before inserting it into HTML content to prevent script execution.

Image suggestion: Table or infographic explaining different encoding methods per context (HTML, JS, URL, CSS).

3. Content Security Policy (CSP)

• CSP is an HTTP header that restricts the sources from which scripts, styles, and other resources can be loaded.
• It helps prevent execution of unauthorized scripts even if an attacker manages to inject them.

Image suggestion: Illustration showing browser enforcing CSP blocking external unauthorized scripts.

4. Use HTTPOnly and Secure Cookies

• Set session cookies with the HttpOnly flag to prevent access via JavaScript.
• Use the Secure flag to ensure cookies are only sent over HTTPS.

Image suggestion: Cookie icon with lock and shield symbols representing HttpOnly and Secure flags.

5. Avoid Inline JavaScript and Dangerous Functions

• Avoid inline event handlers (onclick, onload).
• Avoid using eval(), innerHTML with untrusted content.
• Use safer DOM APIs like textContent or setAttribute.

6. Use Security Libraries and Frameworks

• Many modern frameworks provide built-in XSS protection.
• Use libraries like DOMPurify for sanitizing HTML inputs safely.

Example: Simple XSS Vulnerability and Fix

Vulnerable code snippet:

<div>User comment: <span id="comment"></span></div>
<script>
  var comment = getUserComment(); // User input without sanitization
  document.getElementById('comment').innerHTML = comment;
</script>

If comment contains <script>alert('XSS')</script>, it executes.

Fixed version:

document.getElementById('comment').textContent = comment; // Escapes HTML

XSS attacks exploit improper handling of user inputs and outputs in web applications, posing serious security threats. By validating inputs, encoding outputs, implementing CSP, and following secure coding practices, developers can significantly reduce the risk of XSS attacks and protect their users.