API «Trusted Types»

API «Trusted Types» предоставляет веб-разработчикам возможность защитить небезопасные части API DOM от атак типа межсайтовый скриптинг (XSS).

Атаки XSS, основанные на клиентской стороне или DOM, происходят, когда данные, контролируемые пользователем (например, вводимые в поле формы), попадают в функцию, которая может выполнить эти данные. Такие функции известны как стоки инъекций. Атаки DOM-XSS возникают, когда пользователь может ввести произвольный JavaScript-код, который выполняется одной из этих функций.

API «Trusted Types» блокирует небезопасные стоки инъекций, требуя обработки данных перед передачей их в одну из этих функций. Если вы используете строку, браузер сгенерирует TypeError и предотвратит использование функции.

API «Trusted Types» работает вместе с Политикой безопасности контента с директивами trusted-types и require-trusted-types-for.

API «Trusted Types» блокирует стоки инъекций, которые могут служить вектором атак DOM-XSS. Стока инъекций — это любая функция Web API, которая должна вызываться только с надёжными, проверенными или очищенными данными. Примерами стоков инъекций являются:

• Функции, вставляющие HTML в документ, такие как Element.innerHTML, Element.outerHTML или Document.write().
• Функции, создающие новый документ того же происхождения с управляемым вызывающим элементом разметкой, такие как DOMParser.parseFromString().
• Функции, выполняющие код, такие как eval().
• Сеттеры для атрибутов Element, принимающих URL кода для загрузки или выполнения.

API «Trusted Types» заставит вас обработать данные перед передачей их в стоку инъекций вместо использования строки. Это гарантирует надёжность данных.

Политика — это фабрика для Trusted Types. Веб-разработчики могут указать набор политик, используемых для создания типизированных объектов, которые формируют надёжную базу кода для валидных объектов Trusted Type.

TrustedHTML

Представляет строку для вставки в стоку инъекции, которая будет отображаться как HTML.

TrustedScript

Представляет строку для вставки в стоку инъекции, которая может привести к выполнению скрипта.

TrustedScriptURL

Представляет строку для вставки в стоку инъекции, которая будет обработана как URL внешнего ресурса скрипта.

TrustedTypePolicy

Определяет функции, используемые для создания вышеперечисленных объектов Trusted Type.

TrustedTypePolicyFactory

Создаёт политики и проверяет, что экземпляры объектов Trusted Type были созданы с помощью одной из политик.

В примере ниже мы создаём политику, которая будет создавать объекты TrustedHTML с помощью TrustedTypePolicyFactory.createPolicy(). Затем мы можем использовать TrustedTypePolicy.createHTML() для создания очищенной строки HTML, которую можно вставить в документ.

Очищенное значение можно использовать с Element.innerHTML, чтобы гарантировать, что новые элементы HTML не могут быть внедрены.

<div id="myDiv"></div>

const escapeHTMLPolicy = trustedTypes.createPolicy("myEscapePolicy", {
  createHTML: (string) =>
    string
      .replace(/&/g, "&")
      .replace(/</g, "&lt;")
      .replace(/"/g, "&quot;")
      .replace(/'/g, "&apos;"),
});

let el = document.getElementById("myDiv");
const escaped = escapeHTMLPolicy.createHTML("<img src=x onerror=alert(1)>");
console.log(escaped instanceof TrustedHTML); // true
el.innerHTML = escaped;

Узнайте больше об этом примере и других способах очистки входных данных в статье Защита от уязвимостей DOM-XSS с помощью Trusted Types.

• Защита от уязвимостей DOM-XSS с помощью Trusted Types
• Полифил Trusted Types (также доступен как пакет npm)