UI redressing: когда CSS становится инструментом атаки
UI redressing — группа атак, при которых пользователь видит одно, а взаимодействует совсем с другим.
Злоумышленники пользуются тем, что в браузере взаимодействие с интерфейсом завязано на событиях: click, pointerdown, mousedown, dragstart и других. Например:
1. Clickjacking — подмена клика
Допустим, злоумышленник создаёт страницу с кнопкой «Получить подарок». Поверх неё размещает прозрачный iframe с другим сайтом и располагает его так, чтобы кнопка подтверждения действия оказалась прямо над нарисованной кнопкой подарка. Пользователь видит подарок и нажимает на него. Но событие click получает кнопка внутри iframe, потому что именно она находится в точке нажатия. Дальше срабатывает обычный обработчик события на целевом сайте. Например, отправляется запрос на изменение настроек аккаунта.
2. Cursorjacking — подмена курсора
Настоящий курсор скрывают через CSS, а вместо него рисуют фальшивый, смещённый относительно реального положения указателя. Пользователь ориентируется на нарисованный курсор, но браузер отправляет события мыши по настоящим координатам.
3. Double-clickjacking — подмена второго клика
Злоумышленник открывает дополнительное окно и просит пользователя дважды нажать на кнопку. Между первым и вторым нажатием окно закрывается, а под курсором оказывается чувствительная кнопка на другой странице. Второй click получает уже другой элемент. При этом защита от встраивания в iframe не помогает, потому что атака не требует iframe.
Как защитить свой сайт разработчику?
Для классического clickjacking используют Content-Security-Policy: frame-ancestors ‘none’ или ‘self’, а для старых браузеров — X-Frame-Options. Но эти заголовки не защищают от всех вариантов UI redressing, для остальных стоит дополнительно проверять контекст взаимодействия и предусматривать подтверждение действий, которое нельзя обойти одним случайным кликом.