SQL Injection Mitigation for React Apps (2025 Guide)
Why React apps still face SQL injection
React runs in the browser; SQL injection (SQLi) happens on the server. The risk appears when your API builds SQL from untrusted input. Your React code must send data safely, but mitigation lives in your backend (Node/Express, Nest, Rails, Django, etc.).
A quick mental model
-
Never concatenate SQL strings.
-
Always use parameterized queries or an ORM.
-
Validate & sanitize at the API boundary.
-
Prefer POST/JSON from React; avoid query-string stuffing.
-
Least-privilege DB users + prepared statements everywhere.
Vulnerable server (Node + Express + MySQL)
// ❌ Vulnerable: string concatenation
app.get('/user', async (req, res) => {
const id = req.query.id; // ?id=1 OR 1=1
const rows = await db.query(`SELECT * FROM users WHERE id = ${id}`);
res.json(rows);
});
Fixed with parameterized queries
// ✅ Safe: placeholders
app.get('/user', async (req, res) => {
const id = Number(req.query.id);
const [rows] = await db.execute('SELECT * FROM users WHERE id = ?', [id]);
res.json(rows);
});
ORM example (Prisma)
// ✅ Prisma parameterizes under the hood
app.post('/user', async (req, res) => {
const { email } = req.body;
const user = await prisma.user.findUnique({ where: { email } });
res.json(user);
});
Validate input at the API boundary (Zod)
import { z } from 'zod';
const schema = z.object({ email: z.string().email() });
app.post('/user', (req, res) => {
const parsed = schema.safeParse(req.body);
if (!parsed.success) return res.status(400).json({ error: 'Invalid input' });
// proceed with parameterized DB call...
});
Safer requests from React
// ✅ Use POST + JSON; avoid building SQL-like URLs
async function lookupUser(email: string) {
const r = await fetch('/api/user', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email })
});
return r.json();
}
// ❌ Don’t do this (easy to log/poison URLs)
fetch('/api/user?email=' + encodeURIComponent(email));
Test your app (and catch regressions)
Run SCA/DAST and probe your endpoints regularly.
Our free Website Vulnerability Scanner tool homepage
Sample vulnerability report generated by the tool to check Website Vulnerability
![]() |
Sample vulnerability assessment report generated with our free tool, providing insights into possible vulnerabilities. |
Explore more posts on our blog: https://www.pentesttesting.com/blog/
Managed IT Services
Harden endpoints, patch databases, and monitor anomalies 24/7.
👉 https://www.pentesttesting.com/managed-it-services/
AI Application Cybersecurity
Secure LLM-backed features and AI microservices hitting your DB.
👉 https://www.pentesttesting.com/ai-application-cybersecurity/
Offer Cybersecurity to Your Clients
White-label pentesting & reports that win trust—and deals.
👉 https://www.pentesttesting.com/offer-cybersecurity-service-to-your-client/
Pro checklist (pin this)
-
Parameterize every query
-
Centralize input validation
-
Use least-privilege DB accounts
-
Log blocked attempts; alert on anomalies
-
Add SQLi tests to CI
Subscribe on LinkedIn https://www.linkedin.com/build-relation/newsletter-follow?entityUrn=7327563980778995713
Comments
Post a Comment