Security Web Dev 2026: Bảo vệ app React trước hacker với OWASP Top 10
7 tháng trước · 4 phút đọc
Hacker breach thực tế: App Việt xuyên thủng chỉ vì XSS
Năm ngoái, team mình làm support cho một app Việt startup, backend Next.js, frontend React. Chỉ sau 2 tháng chạy production, hệ thống bị chèn mã độc redirect toàn bộ traffic về site scam. Lý do? Đơn giản, thiếu sanitize data ở 1 input comment nhỏ chưa escape được HTML. Hacker tận dụng lỗ hổng XSS (cross-site scripting) nhúng mã JavaScript chặn người dùng và đánh cắp access token.
Chỉ 1 box input chưa escape đủ cũng đủ để hacker tấn công cả hệ thống - phòng còn hơn chống
Riêng XSS đã chiếm gần 38% incident ứng dụng web tại Việt Nam năm ngoái. Mình từng nghĩ: "Chỉ cần cẩn thận là đủ". Kết quả? Một cú miss nhỏ, mất luôn niềm tin người dùng.
Checklist bảo mật OWASP Top 10 cho React/Next.js thực chiến
OWASP Top 10 giống cuốn sách giáo khoa an toàn web, nhưng phần lớn anh em vẫn skip hoặc chỉ đọc lý thuyết. Thực tế làm dự án Việt càng phải sát sao từng dòng input và endpoint. Checklist này mình audit hằng tháng cho 3 production app:
Cứ đi checklist này mỗi tháng, bug bảo mật giảm đến 80%
Top 5 điểm phải soi ngoài XSS:
- SQL Injection: Validate params strict, tránh query raw
- Broken Auth: Không lưu token vào localStorage/public cookie
- Sensitive Data Exposure: Tuyệt đối không log access token, API key ra console
- Security Misconfiguration: Tắt debug/tool trên production
- API: Rate limit với public endpoint
Bạn có thể dùng các tool audit miễn phí: OWASP ZAP, Snyk. Cứ 1 tháng/lần chạy, gửi report QA check là bay kha khá rủi ro.
Đẩy an toàn JWT & chống XSS sạch cho Next.js/React
Dùng JWT/SSO cực tiện, nhưng mình từng bị leak token chỉ vì lưu Access Token vào localStorage (hacker chỉ cần 1 XSS là lấy được hết). 2026 rồi, chuẩn nên:
- Lưu JWT ở HttpOnly cookie, không để client JS truy cập
- Set SameSite=Strict chống CSRF, MaxAge ngắn
- Escape toàn bộ data render vào DOM: Dùng
dangerouslySetInnerHTMLđúng thì sanitize trước vớidompurify - Trong Next.js, tránh fetch dữ liệu public rồi đẩy thẳng vào SSR/ISR nếu chưa làm sạch
JWT để sai chỗ hoặc escape ẩu là nằm trong top 2 lỗi bị khai thác ở VN
Demo thực tế: Ở dự án logistics, sau 1 tháng chuyển cookie và hardcore escape, chưa thấy alert breach lần nào, trước đó trung bình 2 tuần dính 1 lần.
Tool audit free & các bước phòng thủ cho team nhỏ
Nhiều bạn nghĩ tool quét bảo mật đắt đỏ và chỉ doanh nghiệp lớn mới dùng. Thực ra, team dưới 10 dev ở Việt Nam vẫn có thể audit code ngon lành với tool free. Thực tế mình vận hành:
- OWASP ZAP: Quét dynamic, fake user gửi request bất thường kiểm tra phản ứng app
- Snyk: Check package npm leak/fix lỗi CVE ngay khi push code
- Lighthouse: Đánh giá điểm security frontend
- SonarQube community: FOC, quét code smell/security bug backend lẫn frontend
Dùng tool free mà chạy mỗi tháng, bạn tiết kiệm được cả tuần fix bug về sau
Set CI/CD chạy tự động, team chỉ check report và assign bug. Phòng thủ chủ động hơn ngồi fix bug lặp lại mãi.
Dựng phòng tuyến bảo mật từ gốc cho app Việt
Takeaways:
- Đa số breach ở Việt Nam đến từ data hiển thị không escape, lưu token sai chỗ
- Checklist OWASP + audit tool free = giảm 80% bug từ production
- Thao tác nhỏ: escape kỹ, lưu JWT đúng, chạy scan thường xuyên
Một action bạn làm được ngay: Về audit lại flow lưu token & escape component. Dính bug thật rồi mới thấm!
Comment nếu bạn từng bị breach hoặc cần sample checklist, mình gửi liền.