Security Demo

SQL Injection Demo

A simple browser demo that shows how SQL injection changes a query, why that is dangerous, and how safer queries block it. Nothing here uses a real database.

SQL Web Security OWASP Top 10
!
This is a safe client-side simulation for learning only. It does not attack a real system, and it should not be used against anything you do not own or have written permission to test.
SQL

What you will see

Your input is placed into a fake query so you can see how a login or search can be changed.

WHY

Why it happens

The problem starts when an app builds SQL from raw text instead of treating user input like plain data.

FIX

How to block it

Prepared statements keep the query structure fixed, so user input cannot turn into part of the SQL command.

Bypass login

Secure mode treats what you type like data, not SQL.

Off
Try one of these inputs
Live query
Show data leak

This example shows how a search box can be abused to pull rows from a different table. It is only a browser simulation, but it shows the same idea behind a UNION-based data leak.

Secure mode keeps the search term as plain data.

Off

Product search

Type a normal search or use one of the sample payloads.

Live query

              
Safer version

The main fix is simple: do not build SQL by joining strings together. Send the query and the values separately so the database never treats input like code.

Bad: raw string building

query = (
  "SELECT * FROM users "
  "WHERE username = '" + username + "' "
  "AND password = '" + password + "'"
)

cursor.execute(query)

Good: parameterized query

query = (
  "SELECT * FROM users "
  "WHERE username = %s "
  "AND password = %s"
)

cursor.execute(query, (username, password))
VAL

Check input

Look for the format you expect before anything reaches the database layer.

DB

Limit access

The app account should only have the database permissions it really needs.

ERR

Hide raw errors

Do not show database errors to users because those messages can reveal useful details.

Note

Everything here runs in JavaScript with fake in-memory data. There is no backend, no real SQL server, and no network request, so it is safe to host as a public demo.

How It Was Made

This project was built as a browser-only demo so the attack flow could be shown safely. The page uses plain HTML, CSS, and JavaScript to copy how a weak app might behave, then compares that with a safer query pattern.

Click a topic to view the code

Q&A