SanitizerConfig
Khả dụng hạn chế
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Từ điển SanitizerConfig của HTML Sanitizer API chỉ định các phần tử, thuộc tính và bình luận nào được phép hoặc nên bị xóa khi chèn chuỗi HTML vào Element hay ShadowRoot, hoặc khi phân tích cú pháp chuỗi HTML thành Document.
Lưu ý rằng thông thường các phiên bản Sanitizer được sử dụng thay vì các đối tượng SanitizerConfig, vì chúng hiệu quả hơn để chia sẻ và sửa đổi.
Thuộc tính phiên bản
elements-
Mảng cho biết các phần tử cần cho phép khi làm sạch HTML, tùy chọn cũng chỉ định các thuộc tính được phép hoặc bị xóa.
Mỗi phần tử có thể được chỉ định theo tên (chuỗi) hoặc dưới dạng đối tượng với các thuộc tính:
name-
Chuỗi chứa tên của phần tử.
namespaceOptional-
Chuỗi chứa namespace của phần tử. Namespace mặc định là
"http://www.w3.org/1999/xhtml". attributesOptional-
Mảng cho biết các thuộc tính cần cho phép trên phần tử (được phép) này khi làm sạch HTML.
removeAttributesOptional-
Mảng cho biết các thuộc tính cần xóa khỏi phần tử (được phép) này khi làm sạch HTML.
removeElements-
Mảng cho biết các phần tử cần xóa khi làm sạch HTML.
Mỗi phần tử có thể được chỉ định theo tên (chuỗi) hoặc dưới dạng đối tượng với
namevànamespacetùy chọn. replaceWithChildrenElements-
Mảng cho biết các phần tử cần thay thế bằng nội dung của chúng khi làm sạch HTML. Chủ yếu được dùng để xóa kiểu dáng khỏi văn bản (ví dụ: bạn có thể sử dụng điều này để chuyển
<b>một số văn bản</b>thànhmột số văn bản). attributes-
Mảng cho biết các thuộc tính cần cho phép khi làm sạch HTML.
Mỗi thuộc tính có thể được chỉ định theo tên (chuỗi) hoặc dưới dạng đối tượng với
namevànamespacetùy chọn. removeAttributes-
Mảng cho biết các thuộc tính cần xóa khỏi các phần tử khi làm sạch HTML.
comments-
truenếu các bình luận được phép, vàfalsenếu chúng cần bị xóa. dataAttributes-
truenếu tất cả các thuộc tínhdata-*sẽ được phép (trong trường hợp này, các thuộc tínhdata-*không được liệt kê trong mảngattributes). Nếufalse, bất kỳ thuộc tínhdata-*nào cần được phép phải được liệt kê trong mảngattributes.
Mô tả
SanitizerConfig chỉ định các phần tử, thuộc tính và bình luận nào được phép hoặc nên bị xóa khi chèn chuỗi HTML vào Element hay ShadowRoot, hoặc khi phân tích cú pháp chuỗi HTML thành Document.
Một phiên bản của loại này có thể được truyền vào hàm tạo Sanitizer() để cấu hình Sanitizer, và được trả về bởi Sanitizer.get().
Nó cũng có thể được truyền làm tham số option.sanitizer khi gọi các phương thức làm sạch.
Cấu hình hợp lệ
Cấu trúc đối tượng cấu hình cho phép khai báo các tùy chọn bộ lọc mâu thuẫn hoặc dư thừa.
Để tránh bất kỳ sự mơ hồ nào, các phương thức nhận phiên bản SanitizerConfig yêu cầu đối tượng cấu hình hợp lệ được truyền vào, và sẽ ném TypeError nếu cấu hình không hợp lệ.
Trong cấu hình sanitizer hợp lệ:
- Có thể định nghĩa mảng
elementshoặcremoveElements, nhưng không phải cả hai. - Có thể định nghĩa mảng
attributeshoặcremoveAttributestoàn cục, nhưng không phải cả hai. - Mảng
replaceWithChildrenElements, nếu được định nghĩa, không được có phần tử nào chung vớielementshoặcremoveElements. - Không có mảng nào được chứa các phần tử hoặc thuộc tính trùng lặp.
Đối tượng rỗng {} là cấu hình hợp lệ.
Cấu hình cho phép và xóa
Một cấu hình có mảng elements và/hoặc attributes được gọi là allow configuration, vì nó xác định hành vi làm sạch theo các giá trị được phép có trong đầu ra.
remove configuration là cấu hình có removeElements và/hoặc removeAttributes, xác định hành vi theo các giá trị sẽ bị xóa khỏi đầu ra.
Ví dụ
>Tạo cấu hình "allow"
Ví dụ này cho thấy cách tạo cấu hình sanitizer "allow" cho phép các phần tử và thuộc tính cụ thể, thay thế các phần tử <b> bằng phần tử con của chúng, cho phép bình luận được bao gồm trong đầu ra và yêu cầu các thuộc tính data-* phải được liệt kê rõ ràng.
const sanitizer = new Sanitizer({
elements: ["div", "p", "script"],
attributes: ["id"],
replaceWithChildrenElements: ["b"],
comments: true,
dataAttributes: false,
});
Tạo cấu hình "remove"
Ví dụ này cho thấy cách tạo cấu hình sanitizer "remove" xóa cả phần tử lẫn thuộc tính.
const sanitizer = new Sanitizer({
removeElements: ["span", "script"],
removeAttributes: ["lang", "id"],
comments: false,
});
Cấu hình cho phép phần tử và xóa thuộc tính
Ví dụ này cho thấy cách tạo cấu hình sanitizer "kết hợp" cho phép một số phần tử và xóa một số thuộc tính nhất định.
const sanitizer = new Sanitizer({
elements: ["span", "script"],
removeAttributes: ["lang", "id"],
});
Các cấu hình không hợp lệ
Phần này hiển thị một số cấu hình không hợp lệ. Các cấu hình này sẽ ném TypeError.
Không hợp lệ vì cả elements và removeElements đều được định nghĩa:
const sanitizer1 = new Sanitizer({
elements: ["span", "script"],
removeElements: ["div", "b"],
});
Không hợp lệ vì <span> có trong cả elements và replaceWithChildrenElements:
const sanitizer2 = new Sanitizer({
elements: ["span", "div"],
replaceWithChildrenElements: ["span"],
});
Không hợp lệ vì thuộc tính dư thừa "data-test" được định nghĩa khi dataAttributes là true:
const sanitizer3 = new Sanitizer({
attributes: ["lang", "id", "data-test"],
dataAttributes: true,
});
Không hợp lệ vì có cả removeAttributes và dataAttributes được định nghĩa:
const sanitizer4 = new Sanitizer({
removeAttributes: ["lang", "id"],
dataAttributes: true,
});
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| HTML Sanitizer API> # dom-sanitizer-get> |
| HTML Sanitizer API> # dom-sanitizer-sanitizer> |