Visited links are displayed in purple; not visited - blue. This distinction has come to us since the advent of the web. But CSS allows us to reconfigure these properties using the pseudo-selector: visited! Let's say you want to make the visited links gray and reduce their size in order to show the user that this link has already been visited.
a:visited { color: gray; font-size: 6px; }
This style is applied to the current page: ')
Coloring the link in gray, as expected, informs us that it has already been visited, but the font size remains the same! This happens because changing the font size may be the cause of the vulnerability! If CSS can change the font size, I (Jim) can tell if you have visited pornhub.com. But how?
Web pages are available for inspecting the items displayed on the page. The most obvious way is to use window.getComputedStyle (). He talks about the properties applied to the above visited link; as reported by the browser: font-size: 18px; color: rgb (0, 0, 238).
If getComputedStyle reports a font size change from 18px to 6px for the visited links, I (Jim) will understand that the page has created a link to pornhub.com, then I will check the font size in order to determine the browsing history of your browser. I can use this data for targeted advertising, I can sell your data or blackmail you, and so on ... The security hole was closed by banning the font-size change for a: visited.
But the information obtained with getComputedStyle about the color of the visited link will be: rgb (0, 0, 238) - that is, blue. This is a lie - the link is gray! For the color property, browsers close a hole in a vulnerability in another way: instead of prohibiting changes, they force getComputedStyle to lie about the real value.
Why two approaches are used? Why can't we force getComputedStyle to lie about the font-size parameter too? The reason is that you can explore the displayed elements of the web page and other methods, except getComputedStyle. The position of the element on the page can also be checked using .pageXOffset or .pageYOffset. Changing the font-size of the visited link will affect the offset of other elements, which can indirectly check which links were visited. Turning off the font-size for a: visited is a tough but reliable solution.
This link contains a short list of allowed properties, such as color, that should not affect the page layout and cannot be detected. All of them are different forms of color change. All other CSS properties are blocked.
In theory, there is no way by which it could be determined that the color of the visited link has been changed. The only possibility is a temporary attack: let's say if a change in color to pink took longer than blue, the page can measure how long it took to display an item, and compare it with the expected duration.
PS: Special thanks for the help in adjusting the translation of Olga Pereverzeva .
Thanks to Oleg Yatsenko ( Samber ), in the comments he drew attention to the fact that the solution to the problem with such data leakage was first implemented in Mozilla - the author of the decision David Baron .