Frontend Security

Protecting the client side of web applications.

Importance

  • First line of defence
  • Directly interacts with users

Objectives

  • Protect data
  • Ensure user safety
  • Maintain trust

Common Frontend Security Concerns and Vulnerabilities

  • Cross-Site Scripting (XSS)
  • Cross-Site Request Forgery (CSRF)
  • Clickjacking
  • Man-in-the-Middle (MITM) Attacks
  • Insecure Storage
  • Insecure Deserialization
  • Unrestricted File Uploads
  • Information Leakage
  • Insufficient Transport Layer Protection
  • Content Security Policy (CSP) Misconfigurations
  • DOM Manipulation and Injection
  • Third-Party Scripts and Libraries
  • Insufficient Authentication and Authorization

Cross-Site Scripting (XSS)

  • Types
    • Stored XSS
    • Reflected XSS
    • DOM-based XSS
  • Mitigation
    • Input validation and sanitization
    • Output encoding
    • Content Security Policy

Injection of malicious scripts into web pages viewed by other users.

Cross-Site Request Forgery (CSRF)

  • Mitigation
    • Anti-CSRF tokens
    • SameSite cookie attribute
    • Double Submit Cookie pattern
    • Referer validation

Attacker tricks the user into performing actions on their behalf.

Clickjacking

  • Mitigation
    • X-Frame-Options header
    • Framebusters scripts
    • CSP frame-ancestors directive

Tricking users into clicking on something different from what they perceive.

Man-in-the-Middle (MITM) Attacks

  • Mitigation
    • Use of HTTPS
    • Secure WebSocket (WSS)
    • Public Key Pinning
    • HTTP Strict Transport Security (HSTS)

Attacker intercepts communication between client and server.

Insecure Storage

  • Mitigation
    • Avoid storing sensitive data in localStorage or sessionStorage
    • Encrypt sensitive data before storage
    • Use secure cookies with the HttpOnly

Storing sensitive data insecurely on the client side.

Frontend Security

By Francisco Ramos

Made with Slides.com

Frontend Security

  • 111

More from Francisco Ramos