有关此问题的更多信息,请查看 David Baron 的文章、错误报告 以及 安全博客上的文章。
多年来,CSS :visited 选择器一直是查询用户访问历史的一种途径。它本身并不特别危险,但当它与 JavaScript 中的 <a href="https://mdn.org.cn/en/DOM/window.getComputedStyle">getComputedStyle()</a>
组合使用时,就意味着有人可以遍历你的访问历史并找出你访问过哪些网站。而且速度很快 - 一些测试表明 每分钟可以测试 210,000 个 URL。以这种速度,可以暴力破解你的大量访问历史,或者至少通过 指纹识别确定你的身份。考虑到浏览器通常会长时间保存访问历史,它可以揭示你在网络上访问过的大量信息。
在 Mozilla,我们非常重视保护用户的隐私,因此我们将为我们的用户解决这个问题。为此,我们将对 Firefox 中 :visited 的工作方式进行更改。我们还不确定这将在哪个版本中发布,并且修复程序仍在进行代码审查,但我们希望尽快让大家了解我们如何解决这个问题。
这些更改会对网站和开发者产生一些影响,因此您应该了解它们。以下是更改的总体情况
getComputedStyle
(以及类似的函数,如querySelector
)将撒谎。它们将始终返回用户从未访问过该网站的值。- 您仍然可以对已访问的链接进行视觉样式设置,但您可以使用的样式受到严格限制。我们限制了可用于设置已访问链接样式的 CSS 属性,仅限于
<a href="https://mdn.org.cn/en/CSS/color">color</a>
、<a href="https://mdn.org.cn/en/CSS/background-color">background-color</a>
、<a href="https://mdn.org.cn/en/CSS/border-top-color">border-*-color</a>
和<a href="https://mdn.org.cn/en/CSS/outline-color">outline-color</a>
以及<a href="https://mdn.org.cn/en/SVG/Tutorial/Fill_Stroke_and_Gradients">fill</a>
和<a href="https://mdn.org.cn/en/SVG/Tutorial/Fill_Stroke_and_Gradients">stroke</a>
属性的颜色部分。对于已访问链接样式的任何其他部分,将使用未访问链接的样式。此外,对于上面列出的您可以更改的属性,您将无法设置 rgba() 或 hsla() 颜色或<a href="http://www.w3.org/TR/css3-color/#transparent">transparent</a>
。
这些都是使用广泛且非常明显的案例。选择器的工作方式也有一些细微的变化
- 如果您使用同级选择器(组合器),如
:visited + span
,则span
将被设置为链接未被访问时的样式。 - 如果您使用嵌套的链接元素(很少见),并且匹配的元素与正在测试其在访问历史中是否存在的状态的链接不同,则该元素也将被绘制为链接未被访问时的样式。
最后两个有点令人困惑,我们将在另一篇文章中提供示例。
对 Web 开发人员的影响应该很小,这也是我们的目标之一。但有一些领域可能需要更改站点
- 如果您使用 背景图片 来设置链接样式并指示它们是否已被访问,那么这将不再起作用。
- 我们不支持与已访问状态相关的 CSS 过渡。网络上 CSS 过渡内容不多,因此这不太可能影响很多人,但它仍然值得注意,因为它是我们不支持的另一种途径。
我们希望了解更多关于您如何使用 CSS :visited 以及它将对您的网站产生什么影响的信息。如果您发现某些内容会导致某些功能中断,我们至少希望将其记录下来。请在此处留下评论,提供更多信息,以便其他人也能看到。
176 条评论