Preventing Cross-Site Scripting (XSS) Attack in PHP

In this tutorial, you will learn how to Prevent Cross-Site Scripting (XSS) Attacks on your site using PHP Language. The main purpose of this tutorial is to provide the students and new programmers with a reference for learning the best practices for securing the site that they will develop or currently developing. Here, snippets and a sample source code are also provided to give you a better understanding of the topic of this tutorial.

What is Cross-Site Scripting (XSS) Attack?

Cross-Site Scripting Attacks or also known as XSS Attacks is a web security vulnerability that enables the malicious attacker/hackers to inject or execute scripts on the client side. This kind of security vulnerability for that site allows the user to enter text content such as comment sections, forums, etc.

How to Prevent Cross-Site Scripting (XSS) Attacks in PHP?

To Prevent Cross-Site Scripting (XSS) Attacks in PHP, developers must always escape the text content or string that the user has submitted on the site on any instance before rendering or displaying it. Doing so, the malicious scripts will be served as normal text that can only be displayed and won't execute.

PHP comes with built-in methods or functions that are very useful for preventing Cross-Site Scripting (XSS) Attacks. Here are some of the methods of PHP that can help you to prevent XSS attacks:

• htmlentities() - a method for converting all applicable characters to HTML Entities.
• htmlspecialchars() - a method for converting all special characters to HTML Entities.
• filter_input() - a method for getting the external or global variables such as POST and GET data and filtering it optionally (sanitized).
• filter_var() - a method for filtering the given variable.

Although, there are a lot more methods that are useful. The list above is some of the effective built-in methods or functions that PHP has to prevent XSS vulnerability. The listed methods enable you to sanitize or escape the text content first before rendering it to the client-side side.

Example

Let's pretend that your site contains the following form.

<div class="card rounded-0 mb-3 shadow">
    <div class="card-header rounded-0">
        <div class="card-title"><b>Sample Form</b></div>
    </div>
    <div class="card-body rounded-0">
        <div class="container-fluid">
            <form id="sample-form" action="" method="POST">
                <div class="mb-3">
                    <label for="dynamicContent" class="form-label fw-light">Content</label>
                    <textarea class="form-control form-control-sm rounded-0" name="dynamicContent" id="dynamicContent" rows="10" style="resize:none" placeholder="Write your content here..."><?= $_POST['dynamicContent'] ?? "" ?></textarea>
                </div>
            </form>
        </div>
    </div>
    <div class="card-footer text-center rounded-0">
            <button class="btn btn-primary rounded-pill" form="sample-form">Submit Content</button>
    </div>
</div>

If the user will enter and submit the following value:

<script>
    alert("Your site security is vulnerable to XSS Attack!")
</script>

The sample text content provided above will result in JS script text content submitted on the form.

Then, you render the submitted text content something like the following PHP Script:

<?php echo $_POST['dynamicContent'] ?>

It will run or execute the JavaScript that the user submitted from the form which results to show an alert dialog like the following image.

But, if you use the following PHP script for rendering the submitted text content:

<?php
$string = $_POST['dynamicContent'];
$string = htmlspecialchars($string, ENT_QUOTES, 'UTF-8');
// Replacing next line into HTML break tag
$string = str_replace(["\n\r", "\n"], "<br/>", $string);
// Replacing tab characters to 5 spaces
$string = preg_replace("/\t/" , "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;", $string);
// Replacing space character to html non-breaking space
$string = preg_replace("/\s/" , "&nbsp;", $string);
echo $string;
?>

This will result in the following image:

The text content is only shown as normal text content and won't execute the submitted JS script which means that your PHP script rendered textual content that is well escaped or sanitized.

DEMO VIDEO

I also provided the complete source code zip file that I created for this tutorial. You can download it on this site for free so you can run and test it on your end. The download button is located below this tutorial's article content.

That's the end of this tutorial. I hope this Preventing Cross-Site Scripting (XSS) Attack in PHP Tutorial will help you with what you are looking for and will give you an idea/knowledge for securing current and future PHP Projects.

Explore more on this website for more Tutorials and Free Source Codes.

Happy Coding =)