Lỗ hổng XSS (Cross-Site Scripting) là gì? Kỹ thuật Sanitization bảo vệ dữ liệu

Cross-Site Scripting (XSS) luôn nằm trong Top 3 lỗ hổng bảo mật nguy hiểm nhất thế giới theo xếp hạng của OWASP. Khi website bị dính lỗ hổng XSS, tin tặc có thể **âm thầm chèn các đoạn mã JavaScript độc hại vào trang web của bạn**, đánh cắp Cookie đăng nhập, mã token ngân hàng hoặc tự động chuyển hướng khách hàng sang các trang web lừa đảo!

1. 3 Dạng tấn công XSS phổ biến nhất

1. Stored XSS (XSS lưu trữ vĩnh viễn)

Tin tặc gửi đoạn mã độc <script>stealCookies()</script> vào ô bình luận bài viết hoặc tên sản phẩm. Đoạn mã này được lưu vĩnh viễn vào Database và thực thi trên trình duyệt của BẤT KỲ AI truy cập xem bài viết đó!

2. Reflected XSS (XSS phản hồi)

Đoạn mã độc nằm trực tiếp trên URL tìm kiếm (Ví dụ: domain.com/search?q=<script>...</script>). Khi người dùng nhấp vào link, đoạn mã thực thi lập tức.

3. DOM-based XSS (XSS tại giao diện trình duyệt)

Mã độc khai thác trực tiếp các câu lệnh thao tác DOM không an toàn phía Client như innerHTML hay document.write.

2. Kỹ thuật Phòng chống XSS trong React / Next.js

1. Hạn chế sử dụng dangerouslySetInnerHTML

React mặc định tự động Mã hóa (Escape) 100% các chuỗi văn bản render ra JSX để chống XSS. Tuy nhiên, nếu bạn bắt buộc phải dùng dangerouslySetInnerHTML để render nội dung bài viết HTML, BẮT BUỘC phải làm sạch dữ liệu bằng thư viện DOMPurify:

import DOMPurify from 'isomorphic-dompurify';

export default function BlogBody({ content }) {
  const cleanHtml = DOMPurify.sanitize(content);
  return <div dangerouslySetInnerHTML={{ __html: cleanHtml }} />;
}

2. Bật cờ HttpOnly cho Cookie phiên làm việc

Lưu JWT Token đăng nhập trong Cookie gắn cờ HttpOnly và Secure. Mã JavaScript XSS trên trình duyệt sẽ KHÔNG THỂ đọc được Cookie này.

3. Cấu hình Content Security Policy (CSP) Header

Khai báo lá chắn Content Security Policy (CSP) vô hiệu hóa việc thực thi inline script.

Kết luận

Bảo mật XSS đòi hỏi sự cẩn trọng từ khâu lưu trữ dữ liệu đến khâu hiển thị giao diện. Uwmee Software làm sạch 100% dữ liệu HTML và tích hợp lớp bảo mật XSS cho mọi website Next.js. Đọc thêm bài viết lỗ hổng CSRF là gì.