What is XSS (Cross-Site Scripting)?

Introduction

When you build a website, keeping it secure is very important. One of the most common problems in website security is called XSS, which stands for Cross-Site Scripting.

In this blog, we’ll explain XSS in a simple way — what it is, how it works, and how you can protect your site from it.

What is XSS?

XSS (Cross-Site Scripting) is a type of attack where a hacker adds harmful code (usually JavaScript) into your website. When someone opens that page, the bad code runs in their browser.

This usually happens when a website shows user input (like comments or search text) without checking or cleaning it properly.

Simple Example

Let’s say your site has a comment box.

If a person types this:

And your site shows this comment without removing the script part, then any user who sees that page will get a pop-up message.

In real attacks, hackers can do much more dangerous things — like stealing login info or redirecting users to fake websites.

1. Stored XSS (Permanent Attack)

What it is:

The attacker saves (stores) the malicious code in your website's database. Every time someone opens that page, the script runs.

Example:

A user posts a comment like:

If your website displays this comment without filtering it, then whenever anyone views that page, their cookies are stolen and sent to the attacker.

Real-life places it can happen:

1. Blog comments
2. Forum posts
3. User profile bios

2. Reflected XSS (One-Time Attack)

What it is:

The script is not stored anywhere — it’s part of a link. When someone clicks the link, the script runs right away.

Example:

An attacker sends this link to a user:

If the website shows the search term directly in the results without filtering, the alert box will pop up.

Real-life places it can happen:

1. Search boxes
2. Error messages
3. Login forms (in the URL)

3. DOM-Based XSS (Client-Side Attack)

What it is:

This happens when JavaScript in your page takes input from the user (like from the URL) and puts it into the page without checking.

Example:

If someone visits this URL:

Then the script will run, because the page blindly inserted the hash into the HTML.

Real-life places it can happen:

1. Single Page Applications (SPAs)
2. Sites that update the page using JavaScript and user input
3. 
   

How to Prevent XSS

Here are simple ways to stop XSS attacks:

✅ Always clean user input

Remove or escape HTML tags from anything users type.

✅ Don’t use innerHTML

If you’re showing user data in JavaScript, use textContent or innerText instead.

✅ Use secure frameworks

React, Angular, Vue, and others handle XSS better by default.

✅ Set a Content Security Policy (CSP)

This tells the browser to block scripts from unknown sources.

✅ Use HTTP-only cookies

This prevents JavaScript from accessing cookies, making them harder to steal.

Why XSS is a Big Deal

XSS can:

1. Steal login info or cookies
2. Redirect users to fake sites
3. Mess up how your site looks
4. Break user trust

Even simple websites can become targets if not protected.

Final Words

XSS might sound technical, but it’s easy to understand and prevent once you know how it works. By being careful with user input and following safe coding practices, you can keep your website and users safe.

Stay secure, and keep learning! 💻🔒