What is XSS? Provide examples and tell how to protect an application from this vulnerability.

XSS (Cross-Site Scripting) is a vulnerability of web applications where an attacker injects malicious code (usually JavaScript) into a web page viewed by other users. The received code executes in the context of these users' browsers, allowing the attacker to access their data or perform actions on their behalf.

Main types of XSS:

• Reflected XSS: Malicious script is contained in an HTTP request and "reflected" in the server's response without proper sanitization.

  <!-- In response to a request like http://example.com/search?q=<script>alert('XSS!')</script> -->
  <p>Search results for: <script>alert('XSS!')</script></p>
  

• Stored XSS: Malicious script is stored on the server (e.g., in a database) and displayed on the web page whenever viewed by another user.

  <!-- In a forum message or comment -->
  <p>Hello everyone! <script>alert('XSS!')</script></p>
  

• DOM-based XSS: The vulnerability occurs on the client side when malicious script modifies the DOM of the web page. The source of the vulnerability is often in client-side JavaScript processing data from URLs (e.g., request parameters) without proper sanitization.

  // Vulnerable client-side code
  // If document.location.href contains <script>alert('XSS!')</script>
  document.getElementById('output').innerHTML = document.location.href;
  

How to protect the application:

1. Escaping output data: Convert special HTML characters to their corresponding entities before displaying data on the page.

   • & -> &
   • < -> <
   • > -> >
   • " -> "
   • ' -> ' (or ')

   Most web frameworks provide built-in functions for this.

   # Example in Django templates
   # The variable user_input will be automatically escaped
   # when using {{ user_input }}
   

   # Example in Flask with Jinja2 templates
   # {{ user_input }} also escapes by default
   

2. Using security HTTP headers:

   • Content-Security-Policy (CSP): Defines sources of content allowed to be loaded and executed by the browser.

     # Example CSP header in nginx
     add_header Content-Security-Policy "default-src 'self'; script-src 'self' https://cdnjs.cloudflare.com;";
     

   • X-XSS-Protection: Deprecated but still useful header to activate built-in XSS filter in some browsers. It is recommended to use CSP instead.

     # Example in nginx
     add_header X-XSS-Protection "1; mode=block";
     

3. Sanitization of user input: Remove or filter potentially dangerous tags and attributes from user input, especially if limited HTML is allowed (e.g., in a text editor). Use sanitization libraries.

   # Example using Bleach for sanitization in Python
   import bleach
   
   user_input = '<script>alert("XSS!")</script><p>Hello</p>'
   safe_input = bleach.clean(user_input, tags=['p', 'a', 'strong'])
   print(safe_input)
   # Output: <p>Hello</p>
   

4. Protection against DOM-based XSS:

   • Avoid using innerHTML, document.write, eval() with data from untrusted sources (e.g., location.href, location.search).
   • Use safe APIs that handle data as text by default (e.g., textContent).

   // Safer to use textContent
   document.getElementById('output').textContent = document.location.href;
   

By applying a combination of these methods (escaping on output, CSP, sanitization when necessary), you can significantly reduce the risk of exploiting XSS vulnerabilities.