Всё что нужно знать об отпечатке canvas

Сайты отслеживают пользователей разными способами, среди них — canvas fingerprinting. Эта техника позволяет идентифицировать юзеров по тому, как их компьютеры рисуют изображения. Некоторые предлагают создать базу данных хэшей canvas, но это не имеет смысла с технической точки зрения. 

В этой статье мы подробно объясним, как устроен canvas fingerprinting и почему с ним так сложно бороться. 

Что такое хэширование

Прежде чем углубляться в canvas fingerprinting, давайте разберёмся в хэшировании. Хэш-функции берут информацию, например, в виде текста, изображения или аудио, и урезают её до установленного объёма без потери уникальности. Так получаются хэши. 

У всех функций хэширования есть одна общая черта: они используются для уменьшения объёма данных, чтобы эти данные было проще сравнивать.

Хэш-функции используются в canvas fingerprinting, чтобы получать один и тот же результат при одинаковых вводных данных. Например, если вы пропустите слово «причудливый» через хэш-функцию SHA-256, получившийся хэш всегда будет таким:

b6e4acc0d58497837b1273b11bc14bb7334e0b56ecbda2f9b98363d343b30610

Но стоит добавить пробел в конце того же слова, и хэш будет совершенно другим:

e3d52382d090793314599af020841d0772e9fb7f8d94c5dd7415fc896d4e1e8b

Иными словами, малейшая разница ведёт к изменениям результата. Пожалуйста, будьте внимательны!

Ещё одна важная деталь: хэширование необратимо. То есть, преобразовав «dog» в 06d80eb0c50b49a509b49f2424e8c805, вы не сможете откатить хэш и вернуться к исходному «dog». 

Кроме того, хэширование делает невозможным сопоставить полученные данные с исходными. К сожалению, эта деталь никак не мешает canvas fingerprinting.

Как сайты считывают отпечатки canvas?

Canvas fingerprinting начинается с того, что сайт просит ваш браузер нарисовать объект canvas. Объект — это не отпечаток, а только инструмент создания графики при помощи JavaScript.

Изображения могут быть сложными и состоять из нескольких элементов, цветов, фонов, а также могут немного отличаться внешне на разных устройствах. Так как даже незначительные отличия могут привести к абсолютно разным хэшам, компьютеры выдают разные изображения при одинаковых инструкциях. 

Отрисовка изображений с помощью математических формул

Рисовать изображения внутри объекта canvas — не то же самое, что рисовать картинки в MS Paint. В первом случае, нарисованное изображение — это результат сценария, состоящего из математических формул. Вспомните свои школьные годы: как бы вы нарисовали круг, используя формулы?

Во-первых, вам понадобятся две координаты (X и Y), чтобы определить центр круга. Затем — радиус (R), выраженный в пикселях. Далее компьютер рисует круг на экране, заполняя все пиксели, расположенные на расстоянии R от центра круга. Легко, правда?

Но с усложнением изображения усложняется и формула. Используя инструкции на языке JavaScript вы можете создавать фигуры, тени, цвета, фон и другие сложные элементы внутри объекта canvas.

Что делает отпечаток canvas уникальным?

В «каменном веке» эпохи компьютеров все устройства рисовали одно и то же изображение. Но когда появились экраны с высоким разрешением, разработчики аппаратного и программного обеспечения добавили фильтры для улучшения финального вида. 

Эти фильтры применяются, когда формулы превращаются в пиксели. В результате получаются более чёткие изображения. Самый известный фильтр — сглаживание, но есть и другие, например, хинты, которые используются при отрисовке шрифтов.

Все шрифты содержат глифы — набор траекторий или замкнутых кривых, заданных с помощью определённой математической формулы. Например, строчная буква «i» имеет два глифа: один для точки, другой для тела. Эти глифы, также известные как контуры, затем заполняются пикселями для создания окончательной формы буквы.

Глифы могут вести себя по-разному, так как зависят от окружающих их компонентов. Глиф может содержать в себе другие контуры, которые в совокупности образуют составной глиф, например, «é». В этом составном глифе и буква «e», и знак ударения имеют связанные с ними данные о расположении и необязательные данные о трансформации.

Хинты

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

Сглаживание

Сглаживание — возможно, самый популярный фильтр. Вот как он работает: серые пиксели добавляются к неровным краям глифов, таким образом усредняя разницу в тональности и создавая эффект размытия.

Что делает отпечаток canvas уникальным, так это не конечное изображение, а то, как каждый компьютер отображает хинтинг и сглаживание. Разные компьютеры делают это по-разному, что позволяет эффективно считывать отпечатки.

Когда двум компьютерам даётся одна и та же задача, среди прочих отличий появляются немного разные тона пограничных пикселей. Эти незначительные несоответствия приводят к тому, что изображение выглядит одинаково для нас, но не для сайтов. Обратите внимание: согласно исследованиям, компьютерное оборудование, драйверы и версии браузера могут влиять на глифы. Кроме того, мы заметили, что компьютеры с одинаковыми графическими процессорами (GPU), скорее всего, будут давать одинаковые результаты.

Сравнение отпечатков canvas с помощью хэшей

Чтобы считывать отпечатки Canvas, сайты предоставляют инструкции по отрисовке изображений. Но отправлять обработанное изображение обратно нецелесообразно. Вместо этого используется хэширование: размер данных уменьшается, но уникальность сохраняется.

Незначительные различия в изображениях могут привести к разным хэшам. Этот процесс позволяет сайтам идентифицировать и отслеживать посетителей с помощью уникальных строк информации в зависимости от используемого ими компьютера.

Создание базы данных хэшей canvas практически невозможно из-за разнообразия инструкций и функций хэширования. К тому же сайты могут изменить техники считывания в любой момент.

Заключение

Canvas fingerprinting представляет собой серьёзную угрозу конфиденциальности. Хорошим решением могла бы стать блокировка этой функции, но оно не получило широкого распространения. Только 20,000 пользователей по всему миру используют этот подход, что само по себе можно расценивать как полноценный отпечаток. В то же время маскировка отпечатков сanvas фейковыми параметрами требует дополнительных действий, а веб-платформы могут легко это отслеживать.

Наши исследования, к счастью, показывают, что настройка canvas под ваши реальные параметры — лучшее решение. Так вы можете слиться с толпой других пользователей с таким же железом. Тем временем команда экспертов Multilogin продолжает изучать этот вопрос. Следите за нашим блогом, чтобы не пропустить самые актуальные новости!