Content-Security-Policy: style-src-attr directive
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since December 2022.
Chỉ thị style-src-attr trong HTTP Content-Security-Policy (CSP) chỉ định các nguồn hợp lệ cho các style nội tuyến được áp dụng cho các phần tử DOM riêng lẻ.
Chỉ thị này không đặt các nguồn hợp lệ cho các phần tử <style> và các phần tử <link> với rel="stylesheet".
Chúng được đặt bằng style-src-elem (và các nguồn hợp lệ cho tất cả style có thể được đặt bằng style-src).
| Phiên bản CSP | 3 |
|---|---|
| Loại chỉ thị | Fetch directive |
Dự phòng default-src |
Có.
Nếu chỉ thị này vắng mặt thì trình duyệt sẽ tìm kiếm chỉ thị |
Cú pháp
Content-Security-Policy: style-src-attr 'none';
Content-Security-Policy: style-src-attr <source-expression-list>;
Chỉ thị này có thể nhận một trong các giá trị sau:
'none'-
Không có tài nguyên nào thuộc loại này được tải. Dấu nháy đơn là bắt buộc.
<source-expression-list>-
Danh sách các giá trị biểu thức nguồn phân cách bằng khoảng trắng. Tài nguyên thuộc loại này có thể được tải nếu chúng khớp với bất kỳ biểu thức nguồn nào. Đối với chỉ thị này, các giá trị biểu thức nguồn sau đây có thể áp dụng:
style-src-attr có thể được sử dụng kết hợp với style-src:
Content-Security-Policy: style-src <source>;
Content-Security-Policy: style-src-attr <source>;
Ví dụ
Trường hợp vi phạm
Với tiêu đề CSP này:
Content-Security-Policy: style-src-attr 'none'
…style nội tuyến áp dụng cho phần tử bên dưới sẽ không được áp dụng:
<div style="display:none">Foo</div>
Chính sách này cũng sẽ chặn bất kỳ style nào được áp dụng trong JavaScript bằng cách đặt thuộc tính style trực tiếp, hoặc bằng cách đặt cssText:
document.querySelector("div").setAttribute("style", "display:none;");
document.querySelector("div").style.cssText = "display:none;";
Các thuộc tính style được đặt trực tiếp trên thuộc tính style của phần tử sẽ không bị chặn, cho phép người dùng an toàn thao tác style qua JavaScript:
document.querySelector("div").style.display = "none";
Lưu ý rằng việc sử dụng JavaScript có thể độc lập bị chặn bằng chỉ thị CSP script-src.
Thông số kỹ thuật
| Specification |
|---|
| Content Security Policy Level 3 # directive-style-src-attr |