XSS

What is XSS?

Cross-Site Scripting (XSS) is a security vulnerability that occurs when a website allows users to input data (like comments, search terms, or form fields) that contains malicious JavaScript code. If this code isn't properly sanitised, it gets executed in other users' browsers when they view the page.

Why is XSS Dangerous?

When an attacker successfully executes an XSS attack, they can:

• Steal login cookies to hijack user sessions

• Capture keystrokes (like passwords)

• Take screenshots

• Redirect users to malicious sites

• Deface websites

• Access user's webcam or microphone
  
  

Working XSS Attacks on Our Unsecure PWA

1. The Basic Alert Test

Try this in the feedback form:

<script>alert("XSS Test!")</script> 

What's happening:

• Your script gets saved to success_feedback.html

• When anyone views the feedback page, the script runs

• They see a popup message

• Great way to test if XSS is possible
  
  

2. URL Redirect Attack

Try this in the feedback form:

<script>window.location.href="http://example.com"</script> 

What's happening:

• When users view the feedback, they get redirected

• Could send users to malicious sites

• Replace example.com with any URL
  
  

3. Sneaky Image Attack

Try this in the feedback form:

<img src="x" onerror="alert('Image XSS!')"/>

What's happening:

• Creates an image tag that fails to load

• When image fails, runs our code

• Often bypasses basic script filters

• The onerror event triggers because 'x' isn't a valid image
  
  

4. Button Click Attack

Try this in the feedback form:

<button onclick="alert('Clicked!')">Click Me!</button>

What's happening:

• Creates an innocent-looking button

• Runs JavaScript when clicked

• Shows how interactive elements can be dangerous
  
  

Why These Work in Our PWA

Looking at the code:

def listFeedback():

    f = open("templates/partials/success_feedback.html", "w")

    for row in data:

        f.write("<p>\n")

        f.write(f"{row[1]}\n")  # Direct insertion of feedback!

        f.write("</p>\n")

The feedback system:

1. Takes user input without checking it

2. Writes it directly to an HTML file

3. Serves that HTML to other users

4. Never sanitizes or escapes special characters
   
   

Finding XSS Vulnerabilities

Test These Places:

1. Feedback form - directly writes to HTML

2. URL parameters (try adding ?url=javascript:alert(1))

3. Username field - might display on success page

4. Any place your input shows up on screen
   
   

Common XSS Patterns to Try:

Basic Tests:

• <script>alert("XSS")</script> 

• <img src="x" onerror="alert('XSS')"> 

• <button onclick="alert('XSS')">Click me!</button> 

More Advanced:

• <div onmouseover="alert('XSS')">Hover over me!</div> 

• <iframe src="javascript:alert('XSS')"></iframe> 
  
  

Think Like a Developer

Code Review Exercise

Look at this template code:

<div>Welcome back, {{username}}!</div>

<div class="feedback">{{user_feedback}}</div>

Questions:

1. What could happen if username contains <script> tags?

2. Should we allow HTML in feedback at all?

3. How could we safely display user content?
   
   

Security Best Practices:

1. Input Validation:

   • Check length

   • Allow only specific characters

   • Reject known bad patterns

2. Output Encoding:

   • Convert special characters to HTML entities

   • Example: < becomes &lt;

   • Use template engine's built-in escaping

3. Content Security Policy (CSP):
   <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">