CSP và cách CSP ngăn chặn tấn công XSS

CSP (Content-Security-Policy) hay nói rõ hơn là Content Security Policy header hiện đang dần trở nên phổ biến hơn bao giờ hết.

Chúng ta hãy cung tìm hiểu sơ qua về CSP và cách CSP ngăn chặn tấn công XSS.

1. CSP là gì?

CSP (Content Security Policy) là một lớp bảo mật được thêm vào mục đích để phát hiện và ngăn chặn một số loại tấn công thường gặp, bao gồm cả cuộc tấn công XSS (Cross Site Scripting) và tấn công data injection.

CSP là tập hợp một danh sách an toàn (whitelist) những domain hay kiểu script, style, image, frame mà trình duyệt được load trên website của chúng ta. Điều này đảm bảo chỉ có những script, style, image, frame được chúng ta chỉ định có thể được tải, những request không nằm trong whitelist sẽ bị chặn ngay tức khắc.

Các trình duyệt không hỗ trợ CSP vẫn hoạt động bình thường với các máy chủ triển khai nó và ngược lại. Những trình duyệt không hỗ trợ CSP thì CSP sẽ được bỏ qua và thực hiện các chính sách mặc định của trang web.

2. Cách hoạt động CSP

CSP (hay Content-Security-Policy) thực chất là một header nằm trên request khi được gửi đến một server nào đó.

Để enable CSP, chúng ta chỉ cần cấu hình cho server của chúng ta trả về Content-Security-Policy HTTP headers.

Để xem danh sách các thẻ policy đầy đủ bạn có thể xem tại Content-Security-Policy header

Một cách khác chúng ta có thể sử dụng thông qua thẻ <meta>. Ví dụ: <meta http-equiv=”Content-Security-Policy” content=”default-src ‘self’; img-src https://*; child-src ‘none’;”>

3. Các ví dụ về thẻ meta

a. Các directive CSP

• default-src: đối với các directive khác không có, directive sẽ được thực thi
• script-src: chỉ định nguồn (nơi) load các tài nguyên javascript
• style-src: chỉ định nguồn (nơi) load các tài nguyên css
• image-src: chỉ định nguồn (nơi) load các tài nguyên image
• font-src: chỉ định nguồn (nơi) load các tài nguyên font
• frame-src: chỉ định nguồn (nơi) load các tài nguyên frame

b. Các giá trị của CSP directive

• * : Là wildcard, hay còn có nghĩa là all
• self: chỉ định domain đang truy cập
• none: không cho phép bất kỳ nguồn nào
• http://www.domain.com: cho phép tải resource từ domain được chỉ định, cái này khác hoàn toàn với domain.com
• domain.com: cho phép tải resource từ domain chỉ định, không cho phép từ http://www.domain.com, subdomain.domain.com, cdn.domain.com, …
• *.domain.com: cho phép load resource từ subdomain của domain domain.com
• https: cho phép load từ những trang https

c. Các ví dụ

–    Content-Security-Policy: default-src ‘self’
Chỉ cho phép tải resource từ domain hiện tại hoặc domain đang truy cập

–     Content-Security-Policy: default-src ‘self’ *.pavietnam.vn
Cho phép tải resource từ domain hiện tại và từ các subdomain khác của domain pavietnam.vn

–     Content-Security-Policy: default-src ‘self’; img-src *; media-src abc1.com abc2.com; script-src userscripts.com

default-src ‘self’: Cho phép load resource từ domain hiện tại
img-src *: có thể lấy image từ bất kỳ nguồn nào
media-src abc1.com abc2.com: chỉ cho phép load media từ abc1.com và abc2.com
script-src userscripts.com: chỉ cho phép load script từ userscripts.com

4. Theo dõi vi phạm CSP

a. Đặt thẻ report-uri

Bằng cách đặt thẻ report-uri vào thuộc tính Content-Security-Policy kèm theo URI nhận báo cáo trình duyệt sẽ tự động gửi một POST request đến địa chỉ đó kèm theo body là thông tin chi tiết của cuộc tấn công.

Ví dụ thuộc tính Content-Security-Policy đang xác định:

Content-Security-Policy: default-src ‘none’; style-src dreamknight.click; report-uri http://dreamknight.click/collector.cgi

Nếu vi phạm policy: style-src dreamknight.click trình duyệt sẽ gửi một POST request đến: report-uri http://dreamknight.click/collector.cgi

b. Sử dụng tool từ https://report-uri.com

Một tính năng rất hay của CSP là Report URI giúp trình duyệt báo cáo lại cho chúng ta những vi phạm CSP xảy ra ngay trên trang của mình, từ đó biết được hacker đang nhắm tới dạng tấn công nào. Từ những báo cáo này, bạn có thể kiểm tra lại mức độ bảo mật của CSP hoặc nới lỏng một số domain an toàn mà bạn chưa cho vào whitelist.

Cách sử dụng rất đơn giản, mỗi khi có một vi phạm CSP trên trang, trình duyệt sẽ gửi thông tin kèm các dạng vi phạm này đến một dịch vụ định sẵn để chúng ta có thể theo dõi lại. Một trong những dịch vụ miễn phí giúp chúng ta theo dõi vi phạm CSP là https://report-uri.com. Phiên bản miễn phí chỉ hỗ trợ 10,000 report / tháng.

Sau khi đã đăng nhập được vào trang quản trị của Report URI, hãy nhấp vào trang Setup, tiến hành điền 1 subdomain theo ý thích của bạn để định danh với các trang khác.

Khi đã điền subdomain bạn muốn, hãy nhìn qua cột trái, sẽ có luôn một đường dẫn theo subdomain đã tạo. Chúng ta không cần truy cập vào đó mà hãy chèn đường dẫn này vào cấu hình CSP theo cú pháp:

report-uri https://hiepnguyen.report-uri.com/r/d/csp/reportOnly

Và cấu hình Report URI cho CSP cho trang WordPress trở thành:

function header_csp_generate(){
     header("Content-Security-Policy:
          default-src 'self';
          script-src 'self' 'unsafe-inline' www.googletagmanager.com www.google-analytics.com tagmanager.google.com;
          style-src 'self' 'unsafe-inline' tagmanager.google.com;
          img-src 'self' data: www.googletagmanager.com www.google-analytics.com www.google.com www.google.com.vn i.ytimg.com https://*.gravatar.com https://images.dmca.com;
          frame-src www.googletagmanager.com www.google.com www.youtube.com;
          font-src 'self';
          connect-src 'self' *.google.com google.com google.com.vn www.google-analytics.com;
          object-src 'none';
 report-uri https://hiepnguyen.report-uri.com/r/d/csp/reportOnly");
}
add_filter('wp_head', 'header_csp_generate');

Trên là bài viết về CSP và cách CSP ngăn chặn tấn công XSS để Quý khách có thể hiểu rõ một cách dễ dàng.

PA Việt Nam cung cấp dịch vụ thiết kế Website chuyên nghiệp Web30s

CHỈ 30S CÓ NGAY WEBSITE HIỆN ĐẠI VÀ CHUYÊN NGHIỆP

CHỦ ĐỀ WEBSITE CHUYÊN BIỆT THEO NGÀNH NGHỀ

Tham khảo thêm về Web30s tại https://kb.pavietnam.vn/category/web30s.