How XSS attacks exploit unescaped output in PHP - Mechanics & Internals

Overview - How XSS attacks exploit unescaped output

What is it?

Cross-Site Scripting (XSS) attacks happen when a website shows user input without cleaning it first. This lets attackers add harmful code, like JavaScript, that runs in other users' browsers. Unescaped output means the website does not change special characters, so the browser treats them as code instead of text. This can let attackers steal information or change what users see.

Why it matters

Without escaping output, websites become easy targets for attackers to run harmful scripts on visitors' browsers. This can lead to stolen passwords, fake pages, or unwanted actions done by users without knowing. Escaping output protects users and keeps websites safe and trustworthy.

Where it fits

Before learning this, you should understand how web pages display data and basic HTML. After this, you can learn about secure coding practices, input validation, and Content Security Policy (CSP) to further protect websites.

Mental Model

Core Idea

XSS attacks happen because browsers run code from unescaped user input, turning text into executable scripts.

Think of it like...

Imagine a mailroom that opens every letter without checking. If someone sends a letter with a hidden trap inside, it can harm the receiver. Escaping output is like carefully inspecting and wrapping letters so traps can't hurt anyone.

User Input ──> [No Escaping] ──> Browser runs code ──> Attacker controls page

User Input ──> [Escaping] ──> Browser shows safe text ──> No attack

Build-Up - 6 Steps

1

Foundation

What is unescaped output in web pages

Concept: Unescaped output means showing user input directly in HTML without changing special characters.

In PHP, if you print user input like this: and the input is , the browser runs the script instead of showing it as text.

Result

The browser runs the alert popup because the script tags were not changed.

Understanding that browsers treat certain characters as code explains why unescaped output is dangerous.

2

Foundation

How browsers interpret HTML and scripts

Concept: Browsers read HTML and run scripts inside special tags like , it runs the code inside. If user input contains these tags and is shown without changes, the browser runs the attacker's code.

Result

User input with script tags becomes active code on the page.

Knowing how browsers parse HTML helps see why unescaped input can run harmful scripts.

3

Intermediate

Common XSS attack example with unescaped output

🤔Before reading on: do you think showing as user input will run the alert or show as text? Commit to your answer.

Concept: Attackers insert script tags in input fields that get shown without escaping, causing code execution.

Example: User enters: PHP code: Browser runs alert('XSS') because output is unescaped.

Result

Alert box pops up, showing the attack worked.

Recognizing that unescaped output directly leads to code execution is key to preventing XSS.

4

Intermediate

Why escaping output stops XSS attacks

🤔Before reading on: do you think escaping becomes <script>alert('XSS')</script> and shows as text.

Result

Browser shows the script tags as text, no code runs.

Understanding escaping transforms dangerous code into harmless text, stopping attacks.

5

Advanced

Different contexts require different escaping methods

🤔Before reading on: do you think the same escaping works inside HTML, JavaScript, and URLs? Commit to your answer.

Concept: Escaping depends on where the output is placed: HTML body, attributes, JavaScript, or URLs.

Example: - In HTML body: htmlspecialchars is enough. - In HTML attributes: quotes must be escaped. - In JavaScript: special characters need JS escaping. - In URLs: use urlencode. Wrong escaping can still allow attacks.

Result

Proper escaping prevents XSS in all parts of the page.

Knowing context-specific escaping prevents subtle XSS bugs that simple escaping misses.

6

Expert

How modern browsers and CSP reduce XSS risks

🤔Before reading on: do you think escaping alone is enough to stop all XSS attacks? Commit to your answer.

Concept: Browsers and security policies add layers of defense beyond escaping to block or limit XSS damage.

Content Security Policy (CSP) tells browsers which scripts are allowed. Browsers also have built-in XSS filters. These help stop attacks even if escaping fails or is incomplete.

Result

XSS attacks become harder or impossible to run successfully.

Understanding defense in depth shows why escaping is necessary but not always sufficient.

Under the Hood

When a web page outputs user input without escaping, the browser parses special characters like < and > as HTML tags. If these tags include