XSS attacks

Cross-site scripting attacks, or XSS attacks, are a class of web attacks that target the front-end code, particularly HTML and JavaScript.

The main purpose of an XSS attack is to manipulate the front-end code of a dynamic web page, in order to steal information from the page's users or to make them execute arbitrary operations.

However, even if the target is the page's front-end, XSS vulnerabilities are often caused by the site back-end code.

How do such attacks work, exactly? And more important, how do you prevent them?

Let's take a look.

What are XSS attacks?

An attacker, by executing an XSS attack, can edit and manipulate the code generated by a dynamic website.

When this code is received by a user of the target website, this user will run the HTML and JavaScript code manipulated by the attacker.

The victim (and its web browser) will see the code as coming from the legitimate website. Therefore, they have no obvious way to know that the page's code has been manipulated.

Having complete control over the page's code gives the attacker a lot of power.

The attacker can read, change and forward to itself a lot of information, including:

  • any data on the page;
  • values inside the page's forms, even before they are sent;
  • all the page's cookies (including the Session ID, which can be used for Session Hijacking);
  • all the request string values;
  • all the AJAX connections data in the page.

The attacker can forward any of this data to its own website, for example using an AJAX request injected into the page's code.

It can also change the links on the page to force users to click on a malicious website, edit the users' local storage, and even exploit browser vulnerabilities to install malware on the users' devices.

Moreover, the attacker can make the users run arbitrary operations on the website, like posting spam messages on a forum or making monetary transactions on a home banking site.

An XSS attack example

Let's see a simple XSS attack example.

Suppose that your PHP application is an online quiz that asks the visitors for their first name, using a simple form:

After the user clicks "Next", the website shows "Hi, [name]!", where [name] is the name entered by the visitor.

This is the PHP code:

This simple code is vulnerable to XSS attacks.

To understand why, suppose that someone creates a link to the page with an embedded name request value, like this:

(yourpage.php is the address of the form PHP back-end).

If you click the above link, the page will immediately echo "Hi, Steve!”

No problems so far.

But what if someone creates the following link?

This time, the name is a JavaScript code that will be injected into the response page and executed as soon as the user loads the page.

The user will see an alert popup with information about its browser.

Try it yourself: enter "<script>alert(navigator.userAgent);</script>" as the name and see what happens (you can download the PHP script at the end of the lesson to try it).

Lesson Key Point


This specific code is harmless. But it's easy to see how the attacker can inject any JavaScript or HTML code as the "name" request parameter.

For example, the attacker could inject a JavaScript function that reads the page's input values and sends them to the attacker's website with an AJAX background call.

If this happens on an e-commerce website, sensitive data like credit card numbers can be effectively stolen using this technique.

Lesson takeaways

  • XSS attacks target the front-end code, but they are often caused by back-end vulnerabilities.
  • With an XSS attack, an attacker can make the users of the target website execute arbitrary code.
  • It's a very effective technique to steal users' data or to make them run arbitrary operations on the target website.

Complete and Continue