Виммельбух, 1, перетяжка
Виммельбух, 1, перетяжка
Виммельбух, 1, перетяжка

Создан прототип системы для отслеживания пользователей на чистом CSS

Новости Отредактировано

Студент из Германии изобрел технологию, позволяющую следить за рядом действий посетителей сайтов без использования JavaScript.

6К открытий6К показов

Ян Бемер (Jan Böhmer) рассказал о собственной технике отслеживания пользователей, для реализации которой требуется только CSS. Она позволяет узнать такую базовую информацию о посетителе, как:

  • разрешение экрана устройства входа;
  • используемый браузер;
  • кликаемые внешние ссылки;
  • элементы, на которые наводится мышь;
  • системные шрифты.

Принцип работы

Реализация технологии основана на возможности добавлять в CSS изображения из внешних источников через свойство url("foo.bar"). Поскольку ресурсы загружаются по мере необходимости, вместо ссылки на изображение в качестве параметра можно указать ссылку на внешний скрипт для сбора статистики. Это позволяет определить, перешел ли пользователь по ссылке или же просто навел на нее. Примерный вид селектора для осуществления описанного процесса:

			#link2:active::after {
    content: url("track.php?action=link2_clicked");
}
		

При этом PHP-скрипт фиксирует время клика на сервере.

Используемый браузер можно определить с помощью @supports Media-Query. Тут CSS помогает определить свойства, специфичные для каждого браузера (например, -webkit-appearance для Chrome):

			@supports (-webkit-appearance:none) {
    #chrome_detect::after {
        content: url("track.php?action=browser_chrome");
    }
}
		

Для определения шрифта создаётся новое произвольное семейство шрифтов (вместо ссылки на шрифт опять же вставляется ссылка на скрипт для сборки статистики). Затем производится проверка наличия шрифта в системе. В случае неудачи будет вызван уже фиктивный шрифт.

			/** Определение шрифта **/
@font-face {
    font-family: Font1;
    src: url("track.php?action=font1");
}

#font_detection1 {
    font-family: Calibri, Font1;
}
		
Следите за новыми постами
Следите за новыми постами по любимым темам
6К открытий6К показов