Недавно наткнулся на это исследование pdf (по его мотивам уже была статья на хабре), после прочтения, решил поискать более интересные способы использования F-Cache. Объективно, схему с редиректами никто в здравом уме не будет ставить на свой сайт. Это утечка, но утечка представляющая больше теоретический интерес, чем практический(имхо).

Обозначил цель(найти способ проверить F-Cache через javascript) и начал поиски. В ходе экспериментов выделил несколько способов это сделать, но опишу самый интересный, на мой взгляд.

Заранее предупреждаю — это не кроссбраузерное решение. На данный момент, проверял только на десктопных хромах.

Предварительный тест можно пройти здесь: https://favicon-leak.site/

Как это работает

У хрома есть два типа ресурсного кеша: disk и memory. Как многие догадались, disk cache это перманентное хранилище ресурсов, но со своей задержкой на чтение(1+ ms). В свою очередь, memory cache используется для временного хранения часто используемых ресурсов, а чтение, в среднем, мгновенное (0 ms). Таким образом, помещая ресурс в memory cache браузер уменьшает количество чтений с диска и увеличивает скорость повторной загрузки самих ресурсов.

Когда мы первый раз загружаем картинку через <img>, то ее либо загрузит по src, либо достанет из disk cache. В обоих случаях эта картинка, чаще всего, помещается в memory cache. Рассмотрим такой javascript код:

var img = new Image();
img.src = some_image_url;
if (img.complete && img.height + img.width > 0) {
	// Это условие TRUE, только когда картинка успешно была прочитана из memory cache
}

Именно этот код позволяет проверить наличие картинки в memory cache. Из этого можно сделать такой вывод: если загрузить <img> минимум два раза, то во второй раз картинка должна загружаться уже из memory cache.

<img> + <img> + <img> + <img>
<img> + <img> + <img> + <img>

Поведение тега <link rel="icon"> отличается от <img> и повторная загрузка одной картинки всегда читает ее с диска:

<link> + <link> + <link> + <link>
<link> + <link> + <link> + <link>

Ключевой находкой стало такое поведение браузера:

<img> + <img> + <link> + <img>
<img> + <img> + <link> + <img>

Как мы видим, после загрузки картинки через <link>, она помещается в disk cache и при повторном чтении ее через <img> она загружается с диска(даже если уже была в memory). Это нормальное поведение браузера для картинки, которой нет в F-Cache. НО! Если картинка для <link> загружена из F-Cache, то это никак не влияет на состояние, предварительно загруженной в memory cache, картинки. Вероятно, это связанно с тем, что F-Cache никак не взаимодействует с сетевым уровнем. Следовательно, если после
<img> + <img> + <link> + <img> <— загрузка этой картинки произошла мгновенно, то мы можем сделать вывод, что эта картинка была в F-Cache т.к. она не была удалена из memory cache. Вот и вся хитрость, позволяющая проверять наличие картинки в F-Cache.

Важно заметить, что этот метод не 100%-но надежный, т.к. мы не можем точно проверить была ли вообще загруженна картинка в <link>(например, могла произойти сетевая ошибка), поэтому я использую setTimeout. Чем больше timeout, тем выше вероятность, что <link> успел прогрузиться.

Про F-Cache

F-Cache привязан к конкретному профилю, поэтому если вы хотите протестировать с нуля, то лучше всего создать новый профиль в браузере. Время жизни иконок в F-Cache индивидуально для каждой иконки и зависит от cache policy домена-владельца. F-Cache в инкогнито работает только в read-only режиме.

Про сайт https://favicon-leak.site/

Используя автоматизированный хром, я собрал небольшой список ссылок на favicon-ы популярных сайтов. https://favicon-leak.site/ проверяет иконки из этого списка. Возможно, когда вы будете читать эту статью какие-то ссылки уже устареют и будут возвращать ложноотрицательный результат.

Код на github