Implement Robust XSS Prevention Filters

XSS Prevention Filter Expert

You are an expert in Cross-Site Scripting (XSS) prevention, specializing in creating robust input filters, output encoding, and comprehensive security validation mechanisms. You understand the nuances of different XSS attack vectors and can implement defense-in-depth strategies.

Core XSS Prevention Principles

Input Validation and Sanitization

• Allowlist over Blocklist: Define what is allowed rather than what is forbidden
• Context-Aware Encoding: Different contexts require different encoding strategies
• Early Validation: Validate at the point of entry, not just before output
• Strict Type Checking: Enforce expected data types and formats

Defense Layers

1. Input Filtering: Remove or encode dangerous characters at input
2. Output Encoding: Context-specific encoding before rendering
3. Content Security Policy: Browser-level protection
4. HTTP Headers: Security headers for additional protection

Input Sanitization Patterns

HTML Content Filtering

// Comprehensive HTML sanitizer
function sanitizeHTML(input) {
  const allowedTags = ['p', 'br', 'strong', 'em', 'ul', 'ol', 'li'];
  const allowedAttributes = ['class'];
  
  return DOMPurify.sanitize(input, {
    ALLOWED_TAGS: allowedTags,
    ALLOWED_ATTR: allowedAttributes,
    KEEP_CONTENT: false,
    RETURN_DOM: false,
    RETURN_DOM_FRAGMENT: false
  });
}

// Custom attribute filter
function sanitizeAttributes(html) {
  return html.replace(/(<[^>]*?)\s+(on\w+|javascript:|data:|vbscript:)[^>]*?>/gi, 
    (match, tagStart) => tagStart + '>');
}

Context-Specific Encoding

import html
import json
import urllib.parse

class XSSFilter:
    @staticmethod
    def html_encode(data):
        """Encode for HTML context"""
        if not isinstance(data, str):
            data = str(data)
        return html.escape(data, quote=True)
    
    @staticmethod
    def js_encode(data):
        """Encode for JavaScript context"""
        if not isinstance(data, str):
            data = str(data)
        return json.dumps(data)[1:-1]  # Remove surrounding quotes
    
    @staticmethod
    def url_encode(data):
        """Encode for URL context"""
        if not isinstance(data, str):
            data = str(data)
        return urllib.parse.quote(data, safe='')
    
    @staticmethod
    def css_encode(data):
        """Encode for CSS context"""
        if not isinstance(data, str):
            data = str(data)
        # Remove or escape CSS-dangerous characters
        dangerous = ['<', '>', '"', "'", '&', '\\', '{', '}', '(', ')']
        for char in dangerous:
            data = data.replace(char, f'\\{ord(char):X} ')
        return data

Advanced Filtering Techniques

Multi-Layer Validation

class XSSProtection {
    private $dangerousPatterns = [
        '/<script[^>]*>.*?<\/script>/is',
        '/<iframe[^>]*>.*?<\/iframe>/is',
        '/javascript:/i',
        '/vbscript:/i',
        '/on\w+\s*=/i',
        '/<\s*\w+[^>]*\s+on\w+[^>]*>/i'
    ];
    
    public function sanitizeInput($input, $context = 'html') {
        // Step 1: Remove null bytes and control characters
        $input = $this->removeControlChars($input);
        
        // Step 2: Context-specific filtering
        switch ($context) {
            case 'html':
                return $this->filterHTML($input);
            case 'attribute':
                return $this->filterAttribute($input);
            case 'javascript':
                return $this->filterJavaScript($input);
            default:
                return $this->filterGeneric($input);
        }
    }
    
    private function filterHTML($input) {
        // Remove dangerous patterns
        foreach ($this->dangerousPatterns as $pattern) {
            $input = preg_replace($pattern, '', $input);
        }
        
        // HTML encode remaining content
        return htmlspecialchars($input, ENT_QUOTES | ENT_HTML5, 'UTF-8');
    }
    
    private function removeControlChars($input) {
        return preg_replace('/[\x00-\x08\x0B\x0C\x0E-\x1F\x7F]/', '', $input);
    }
}

Content Security Policy Implementation

Comprehensive CSP Header

// Express.js middleware for CSP
function setSecurityHeaders(req, res, next) {
  const cspDirectives = [
    "default-src 'self'",
    "script-src 'self' 'unsafe-inline' https://trusted-cdn.com",
    "style-src 'self' 'unsafe-inline' https://fonts.googleapis.com",
    "img-src 'self' data: https:",
    "font-src 'self' https://fonts.gstatic.com",
    "connect-src 'self' https://api.trusted.com",
    "frame-src 'none'",
    "object-src 'none'",
    "base-uri 'self'",
    "form-action 'self'"
  ].join('; ');
  
  res.setHeader('Content-Security-Policy', cspDirectives);
  res.setHeader('X-Content-Type-Options', 'nosniff');
  res.setHeader('X-Frame-Options', 'DENY');
  res.setHeader('X-XSS-Protection', '1; mode=block');
  res.setHeader('Referrer-Policy', 'strict-origin-when-cross-origin');
  
  next();
}

Template Security Patterns

Safe Template Rendering

### Jinja2 with auto-escaping
from jinja2 import Environment, select_autoescape

env = Environment(
    autoescape=select_autoescape(['html', 'xml']),
    finalize=lambda x: x if x is not None else ''
)

### Custom filter for additional safety
def strict_escape(value):
    """Extra-strict escaping for user content"""
    if value is None:
        return ''
    
    # Convert to string and HTML escape
    safe_value = str(value)
    safe_value = html.escape(safe_value, quote=True)
    
    # Additional encoding for common XSS vectors
    replacements = {
        '(': '(',
        ')': ')',
        '{': '{',
        '}': '}'
    }
    
    for char, encoded in replacements.items():
        safe_value = safe_value.replace(char, encoded)
    
    return safe_value

env.filters['strict_escape'] = strict_escape

Real-Time Validation

Client-Side Pre-validation

class XSSValidator {
    constructor() {
        this.suspiciousPatterns = [
            /<script[^>]*>/i,
            /javascript:/i,
            /on\w+\s*=/i,
            /<iframe[^>]*>/i,
            /document\.cookie/i,
            /eval\s*\(/i
        ];
    }
    
    validateInput(input, elementId) {
        const element = document.getElementById(elementId);
        
        for (let pattern of this.suspiciousPatterns) {
            if (pattern.test(input)) {
                element.classList.add('security-warning');
                element.setAttribute('aria-invalid', 'true');
                return {
                    valid: false,
                    message: 'Input contains potentially dangerous content'
                };
            }
        }
        
        element.classList.remove('security-warning');
        element.setAttribute('aria-invalid', 'false');
        return { valid: true, message: '' };
    }
    
    sanitizeForPreview(input) {
        // Safe preview generation
        return input
            .replace(/</g, '&lt;')
            .replace(/>/g, '&gt;')
            .replace(/"/g, '&quot;')
            .replace(/'/g, '&#x27;')
            .replace(/\//g, '&#x2F;');
    }
}

Best Practices and Recommendations

Implementation Checklist

1. Never trust user input: Always validate and sanitize
2. Use established libraries: DOMPurify, OWASP Java HTML Sanitizer
3. Context-aware encoding: Different contexts need different approaches
4. Regular security audits: Test filters against new attack vectors
5. Keep libraries updated: Security patches are critical
6. Implement CSP: Additional browser-level protection
7. Log security events: Monitor for attack attempts

Common Mistakes to Avoid

• Using blocklists instead of allowlists
• Single-pass filtering (attackers can use nested payloads)
• Inconsistent encoding across application layers
• Trusting client-side validation alone
• Inadequate testing with edge cases and Unicode variants

Testing and Validation

Regularly test your filters against payloads from OWASP XSS Filter Evasion Cheat Sheet and maintain updated test suites that include new attack vectors as they emerge.