Input Validation / CSS Injection (Reflected)
Description
CSS Injection (reflected) is an input validation vulnerability that occurs when an application does not properly validate input from a web or API user. This type of attack allows malicious code to be injected into a web page such that it is reflected back to the user when it is rendered by their web browser. It is classified as a CWE-79 ‘Improper Neutralization of Input During Web Page Generation’ vulnerability and is stated as a ‘top 10’ risk in the OWASP Testing Guide. CSS injection can allow malicious users to manipulate the design elements of a web page, or even steal sensitive information such as user login credentials.
Risk
CSS Injection (reflected) is considered a high risk vulnerability as it can be used to manipulate the user interface of a web application, or even to steal sensitive information. It is important to ensure that all user input is validated to prevent malicious code from being inserted into a web page.
Solution
The solution to CSS Injection (reflected) is to ensure that all user input is properly validated. This can be done by using a whitelist to only allow certain characters to be used in a particular field, or by using regular expressions to verify that only valid input is accepted. Additionally, any user-supplied data should be encoded or escaped before being rendered in a web page.
Example
The following example is taken from CVE-2020-6483, where a reflected CSS injection vulnerability was found in a web application.
<html>
<body>
<script>
document.write("<h1>Hello World</h1>");
</script>
<style>
/* User supplied data */
background-image: url('<?php echo $_GET['image']; ?>');
</style>
</body>
</html>
In this example, the application is using user-supplied data to set the background-image of the page. This can be exploited by a malicious user to inject malicious CSS code into the page, which can then be used to modify the page's design or even steal user credentials.