Отключаем любые элементы из нашего DOM дерева, используя MutationObserver

в 6:04, , рубрики: javascript, mutationobserver

Недавно сидя на диване, я решил поиграться с MutationObserver. Это достаточно знатная фича, с помощью которой можно слушать DOM дерево. Сейчас достаточно распространена.

Так же с помощью MutationObserver можно не только лишь слушать, но и по факту предотвращать изменения DOM дерева. Подумав об этом, я сделал библиотечку, которая может блокировать ненужные теги и атрибуты, которыми вы все равно не стали пользоваться.

Выглядит это вот так:

{
    "tagsType": "blacklist",
    "tags": [
        "script"
    ],
    "attributesType": "blacklist",
    "attributes": {
        "*": ["onerror"]
    }
}

кря

С помощью манифеста мы для примера отрезали все теги script, и все атрибуты onerror, которые не должно выйти добавить после запуска strict_dom. Т.е. по сути так можно вырезать многие потенциальные XSS уязвимости на сайте (в данном варианте не особо на самом деле), или отучить себя и свою команду использовать какие-либо устарелые HTML теги и атрибуты.

Манифест может иметь следующие параметры:

  • outdatedUrl — ссылка на которую будет редиректить, если браузер старый (по умолчанию отключено)
  • tagsType — выбираем принцип блеклиста или вайтлиста для удаления тегов
  • tags — список ненужных тегов
  • attributesType — выбираем принцип блеклиста или вайтлиста для удаления атрибутов к тегам
  • attributes — список ненужных атрибутов

Собственно, все это работает через MutationObserver, а код можете подглядеть тут

Автор: mitinsvyat

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js