Tạo CSP Header
Trình tạo CSP header này dựng header Content-Security-Policy một cách trực quan, để bạn khóa chặt những script, style, hình ảnh và tài nguyên khác mà trình duyệt được phép tải. Bật các directive bạn cần, nhấn vào những nguồn bạn tin tưởng, và header hoàn chỉnh xuất hiện ngay lập tức — sẵn sàng dán vào máy chủ web của bạn.
Content-Security-Policy là tuyến phòng thủ đầu tiên của bạn trước tấn công cross-site scripting (XSS), clickjacking và các kiểu chèn mã khác. Không có nó, trình duyệt tải tài nguyên từ mọi nguồn; với một chính sách được tinh chỉnh, chỉ những domain bạn cho phép mới được phục vụ nội dung. Trình dựng này biến chính sách đó thành header sẵn sàng sao chép đúng định dạng mà nền tảng của bạn cần — HTTP thô, Apache, Nginx, thẻ meta HTML, hay một lệnh gọi header() trong PHP.
Cách Dùng Trình Tạo CSP Header
Chọn điểm khởi đầu
Chọn một mẫu để nạp cấu hình thông dụng — Nghiêm ngặt, Website cơ bản, SPA + API, WordPress, Thương mại điện tử hay CDN — hoặc bắt đầu từ Trống để dựng từ đầu.
Cấu hình directive
Bật một directive bằng cách nhấn vào công tắc hoặc hàng tiêu đề của nó. Sau đó nhấn các nút nguồn nhanh như 'self', 'none' hay 'unsafe-inline', hoặc nhập một domain tùy chỉnh như cdn.example.com rồi nhấn Thêm. Nhấn lại vào một nguồn để gỡ bỏ.
Xem lại cảnh báo
Khi bạn dựng, công cụ phân tích chính sách và đánh dấu vấn đề — lỗi đỏ cho rủi ro thực sự như thiếu object-src hay nguồn ký tự đại diện, cảnh báo vàng cho điểm yếu, và lưu ý xanh kèm bối cảnh hữu ích.
Chọn định dạng và sao chép
Chuyển tab kết quả sang Raw, Apache, Nginx, Thẻ Meta hay PHP để khớp với máy chủ của bạn, rồi nhấn Sao chép. Hãy bật Report-Only trước để thử nghiệm chính sách mà không chặn bất cứ thứ gì.
Tính Năng
Trình Dựng Directive Trực Quan
Mỗi directive là một hàng tương tác kèm công tắc. Bật một directive để mở bảng nguồn của nó với các nút thêm nhanh và ô nhập domain tùy chỉnh.
17 Directive CSP
Bao quát mọi directive thông dụng trải khắp nhóm Nạp tài nguyên, Tài liệu, Điều hướng và Khác — từ default-src và script-src đến frame-ancestors và report-uri.
Nút Nguồn Nhanh
Một cú nhấp thêm các giá trị thông dụng: 'self', 'none', 'unsafe-inline', 'unsafe-eval', 'strict-dynamic', data:, blob: và https:.
7 Mẫu Dựng Sẵn
Khởi động nhanh với cấu hình Trống, Nghiêm ngặt, Website cơ bản, SPA + API, WordPress, Thương mại điện tử và CDN dựng cho các nền tảng thực tế.
Phân Tích Bảo Mật Trực Tiếp
Cảnh báo trực tiếp đánh dấu 'unsafe-inline' và 'unsafe-eval' trong script, thiếu object-src hay base-uri, và các nguồn ký tự đại diện làm yếu chính sách.
5 Định Dạng Xuất
Xuất dưới dạng header HTTP thô, directive Apache, add_header của Nginx, thẻ meta HTML, hay lệnh gọi header() trong PHP — tùy máy chủ của bạn cần.
Chế Độ Report-Only
Chuyển header sang Content-Security-Policy-Report-Only để theo dõi vi phạm mà không chặn tài nguyên trong khi bạn tinh chỉnh chính sách.
Logic Nguồn Thông Minh
Chọn 'none' sẽ xóa các nguồn khác vì chúng loại trừ lẫn nhau, thêm bất kỳ nguồn nào sẽ gỡ 'none', và các nguồn trùng lặp được ngăn tự động.
Sao Chép Một Cú Nhấp
Sao chép header tạo ra vào clipboard chỉ với một cú nhấp, rồi dán thẳng vào cấu hình máy chủ của bạn.
Chạy Hoàn Toàn Trên Trình Duyệt
Mọi thứ chạy trong trình duyệt của bạn, không gọi máy chủ và không theo dõi, nên chính sách của bạn luôn nằm trên thiết bị của bạn.
Câu Hỏi Thường Gặp
Header Content-Security-Policy (CSP) là gì?
Content-Security-Policy là một header phản hồi HTTP, báo cho trình duyệt biết những nguồn nào được phép tải script, style, hình ảnh, font và các tài nguyên khác trên trang của bạn. Đây là một trong những biện pháp phòng thủ hiệu quả nhất trước cross-site scripting (XSS) và các kiểu chèn mã khác, vì bất cứ thứ gì từ nguồn bạn không cho phép đều bị chặn.
Làm sao để tạo CSP header cho website của tôi?
Bắt đầu từ một mẫu như Nghiêm ngặt hay Website cơ bản, hoặc khởi đầu từ Trống. Bật các directive bạn cần, nhấn hoặc nhập những nguồn bạn tin tưởng, và header được tạo ngay khi bạn thao tác. Sau đó chọn định dạng xuất cho máy chủ và nhấn Sao chép — không cần thuộc lòng cú pháp directive.
Nên dùng CSP qua thẻ meta hay header phản hồi?
Header phản hồi là lựa chọn mạnh hơn. Thẻ <meta> trong HTML không dùng được chế độ Report-Only, không đặt được frame-ancestors, và không dùng được report-uri. Chỉ dùng thẻ meta khi bạn không thể đặt header trên máy chủ; nếu không, hãy ưu tiên xuất Apache, Nginx hay PHP để có đầy đủ chức năng CSP.
default-src và script-src nghĩa là gì?
default-src là giá trị dự phòng cho bất kỳ directive nạp tài nguyên nào bạn không đặt rõ ràng — vậy nên default-src 'self' giới hạn các loại tài nguyên chưa khai báo về chính domain của bạn. script-src kiểm soát nơi JavaScript được phép tải, và bất kỳ directive nào bạn đặt rõ ràng sẽ ghi đè default-src cho loại tài nguyên đó.
Làm sao test CSP mà không làm hỏng website?
Bật chế độ Report-Only. Khi đó công cụ phát ra header Content-Security-Policy-Report-Only, ghi lại các vi phạm mà không chặn bất kỳ tài nguyên nào. Theo dõi báo cáo, tinh chỉnh các nguồn, và chỉ chuyển sang header Content-Security-Policy thực thi khi chính sách đã sạch.
'unsafe-inline' có thật sự nguy hiểm đến vậy không?
Có. Cho phép 'unsafe-inline' trong script-src để mọi script nội tuyến đều chạy được — kể cả script mà kẻ tấn công chèn qua lỗ hổng XSS — điều này gần như vô hiệu hóa lớp bảo vệ mà CSP mang lại. Trình dựng sẽ đánh dấu nó cho bạn. Hãy ưu tiên nonce hoặc hash, vốn cho phép các script nội tuyến cụ thể trong khi vẫn chặn script bị chèn vào.
Tại sao luôn nên thêm object-src 'none'?
Directive object-src kiểm soát các plugin như Flash và Java applet, vốn có thể chạy mã tùy ý và vượt qua các lớp bảo vệ CSP khác. Đặt object-src 'none' sẽ chặn mọi nội dung plugin, và vì website hiện đại hiếm khi cần plugin, đây là một mặc định an toàn, được khuyến nghị — công cụ sẽ cảnh báo khi nó bị thiếu.
Chưa có bình luận nào. Hãy là người đầu tiên!