Security Playground

Welcome to the interactive security demonstration playground! This page provides safe, hands-on learning experiences for common web vulnerabilities. All demos run client-side and use simulated environments - no actual security risks.

Cross-Site Scripting (XSS) Demo

🔒 Reflected XSS Demonstration

XSS
This demo shows how XSS attacks work by comparing vulnerable and sanitized outputs. Try entering different payloads to see how they behave in both scenarios. **Learning objectives:** - Understand how user input can be reflected unsafely - See the difference between vulnerable and sanitized output - Practice identifying XSS attack vectors
⚠️ This is a safe, educational simulation. No actual vulnerabilities are present.

SQL Injection Demo

🔒 SQL Injection Attack Simulation

SQLI
This simulation uses a mock database to demonstrate SQL injection attacks. You can see how malicious input affects database queries and results. **Learning objectives:** - Understand SQL injection attack mechanics - See the difference between vulnerable and parameterized queries - Practice crafting and identifying SQL injection payloads
⚠️ This is a safe, educational simulation. No actual vulnerabilities are present.

CSRF (Cross-Site Request Forgery) Demo

🔒 CSRF Attack Simulation

CSRF
This demo shows how CSRF attacks work by simulating malicious requests that exploit user authentication. Compare vulnerable forms with CSRF-protected implementations. **Learning objectives:** - Understand how CSRF attacks abuse user authentication - See the importance of CSRF tokens in form protection - Practice identifying CSRF attack vectors and defenses
⚠️ This is a safe, educational simulation. No actual vulnerabilities are present.

SSRF (Server-Side Request Forgery) Demo

🔒 SSRF Attack Demonstration

SSRF
This simulation shows how attackers can abuse server functionality to make unauthorized requests. See how input validation and URL whitelisting prevent SSRF attacks. **Learning objectives:** - Understand how SSRF attacks target internal resources - Learn about URL validation and whitelisting techniques - Practice crafting and identifying SSRF payloads
⚠️ This is a safe, educational simulation. No actual vulnerabilities are present.

XXE (XML External Entity) Demo

🔒 XXE Injection Simulation

XXE
This demo demonstrates XML External Entity attacks that can lead to file disclosure and remote code execution. Compare vulnerable XML parsers with secure configurations. **Learning objectives:** - Understand XXE attack mechanics and entity injection - Learn secure XML parser configuration practices - Practice identifying XXE vulnerabilities in XML processing
⚠️ This is a safe, educational simulation. No actual vulnerabilities are present.

Additional Security Concepts

Why Interactive Demos Matter

Interactive learning helps security professionals and developers:

  1. Safe experimentation - Practice with real payloads without risk
  2. Immediate feedback - See results of both attacks and defenses
  3. Visual learning - Understand concepts through hands-on experience
  4. Retention - Interactive content is more memorable than static text

Implementation Notes

These demos use:

  • Client-side simulation for safety
  • Mock data instead of real databases
  • Sandboxed environments to prevent actual exploitation
  • Educational warnings to clarify the learning context

The framework is extensible - new vulnerability types can be added by implementing additional demo types in the security-demos.js framework.

Next Steps

Try the demos above, then check out related posts on: