Почему нельзя установить размер шрифта у посещенной ссылки
Посещенные ссылки отображаются фиолетовым; не посещенные — голубым. Это различие пришло к нам с времен появления веба. Но CSS позволяет нам перенастроить эти свойства с помощью псевдо-селектора :visited! Скажем, вы хотите сделать посещенные ссылки серыми и уменьшить их размер, для того чтобы показать пользователю что эта ссылка уже была посещена.
Этот стиль применен к текущей странице:
Окрашивание ссылки в серый цвет, как и предполагалось, уведомляет нас о том что она уже была посещена, но размер шрифта остался прежним! Так происходит, потому что изменение размера шрифта может быть причиной уязвимости! Если CSS сможет изменить размер шрифта, я (Jim) могу сказать посещали ли Вы pornhub.com. Но как?
Веб страницы доступны для инспектирования отображенных элементов на странице. Наиболее очевидный способ — использовать window.getComputedStyle(). Он рассказывает о свойствах, примененных к вышеупомянутой посещенной ссылке; как сообщает браузер: font-size: 18px; color: rgb(0, 0, 238).
Если getComputedStyle сообщит об изменении размера шрифта с 18px до 6px для посещенных ссылок, я (Jim) пойму, что на странице создана ссылка на pornhub.com, затем я проверю размер шрифта, для того чтобы определить историю посещений вашего браузера. Я могу использовать эти данные для таргетированной рекламы, могу продать ваши данные или шантажировать вас, и так далее… Дыра в безопасности была закрыта путем запрета на изменение font-size для a:visited.
Но информация, полученная с помощью getComputedStyle, о цвете посещенной ссылки будет: rgb(0, 0, 238) — то есть голубое. Это ложь — ссылка же серая! Для свойства color, браузеры закрывают дыру в уязвимости другим способом: вместо запрета на изменение, они заставляют getComputedStyle лгать о реальном значении.
Почему же используется два подхода? Почему мы не можем заставить getComputedStyle лгать также и о параметре font-size? Причина в том, что можно исследовать отображенные элементы веб страницы и другими методам, кроме getComputedStyle. Позицию элемента на странице можно проверить так же с помощью .pageXOffset или .pageYOffset. Изменение font-size у посещенной ссылки будет влиять на смещение у других элементов, из-за чего можно косвенно проверить какие ссылки были посещены. Отключение font-size для a:visited — это жесткое, но надежное решение.
По этой ссылке содержится краткий список разрешенных свойств, таких же как color, которые не должны влиять на макет страницы, и не могут быть обнаружены. Все они — разные формы изменения цвета. Все другие CSS свойства — заблокированы.
В теории, нет способа, с помощью которого можно было бы определить, что цвет посещенной ссылки был изменен. Единственная возможность — временная атака: скажем, если изменение цвета в розовый заняло больше времени по сравнению с голубым, страница может измерить, сколько времени потребовалось для отображения элемента, и сравнить это с ожидаемой продолжительностью.
