黑客如何利用CSS mix-blend-mode在firefox和chrome中获取Facebook用户信息

Posted 前端玩法

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了黑客如何利用CSS mix-blend-mode在firefox和chrome中获取Facebook用户信息相关的知识,希望对你有一定的参考价值。

概述


最近,层叠样式表(CSS)的Web标准中又增加了一些新的功能,这些功能是如此强大,以至于安全研究人员可以滥用这些功能,对演示站点的访问者实施去匿名化攻击,从而暴露他们的Facebook用户名、头像以及是否喜欢特定的Facebook页面。

该漏洞的影响范围并不仅限于Facebook,而是所有允许通过iframe将其内容嵌入其他网页的网站。

漏洞存在于浏览器中,而非网站中


实际上,该漏洞的根本原因,不在于网站,而在于浏览器对名为"mix-blend-mode"的CSS特性的实现,该特性是于2016年引入CSS3 web标准的。

mix-blend-mode特性允许Web开发人员将Web组件叠放在一起,并控制其混合效果。

正如该特性的名称所暗示的那样,这些效果是受Photoshop、Gimp、Paint.net等照片编辑软件中的混合模式的启发而来的。其中,常见的混合模式为叠加、变暗、变亮、颜色减淡、正片叠底、反转等。

CSS3的mix-blend-mode特性支持16种混合模式,其中Chrome浏览器(自从v49版本开始)和Firefox浏览器(自从v59版本开始)对这些模式提供了全面的支持,而Safari浏览器则只提供了部分支持(从macOs系统上的v11版本和从ios系统上的v10.3版本开始)。

研究人员使用DIV堆叠来重建iframe内容


在今天发布的研究报告中,谷歌安全工程师Ruslan Habalov与安全研究员 Dario Weißer一起曝光了攻击者是如何滥用CSS3的mix-blend-mode特性通过其他站点来泄漏用户信息的。

这个漏洞的局限性在于,攻击者必须设法诱导用户访问一个恶意网站,然后在恶意网站里面嵌入iframe来加载其他网站。在上面提及的两位研究人员给出的示例中,虽然两个嵌入的iframe加载的都是Facebook的页面,但其他网站也容易受到这个安全问题的影响。

具体攻击手法为,在iframe之上叠加大量的DIV层,并且每一层都使用不同的混合模式。实际上,每一层只是一个1x1像素的图片,换句话说,每一层只能覆盖iframe的一个像素。

Habalov和Weißer表示,根据渲染所有DIV堆栈所需的时间,攻击者可以确定用户屏幕上显示的像素颜色。

研究人员说,通过逐一将这种DIV“扫描”层放到iframe上面,“就可以确定iframe的内容。”

正常情况下,攻击者是无法访问这些iframe的数据的,这主要得益于浏览器和允许其内容通过iframe进行加载的远程站点中实现的反点击劫持和其他安全措施的限制。

两个令人印象深刻的演示示例


通过两个在线发布的演示示例(https://rawgit.com/evonide/misc/master/fb_name_leak_poc.html和https://rawgit.com/evonide/misc/master/fb_leak_general_poc.html),研究人员能够获取用户的Facebook名称、低分辨率版本头像以及喜欢的站点。

对于现实中的攻击来说,获取用户名只需20秒左右;而500毫秒足以用来检查用户对所有页面的喜欢/不喜欢状态;如果花上20分钟左右的时间的话,就可以获取Facebook用户的头像。

这种攻击很容易实现隐身,因为iframe可以轻松移出屏幕,或隐藏在其他元素下面(请参阅下面的演示gif动画演示,这里的攻击是以猫照片为掩护的)。 此外,通过让用户完成某些在线测试或阅读一篇长文,诱骗用户在网站上驻留几分钟并非难事。


适用于Chrome和Firefox的修复程序

Google和Mozilla的工程师在收到研究人员的漏洞报告后,已经为Chrome 63和Firefox 60修复了这个安全漏洞。

“这个安全问题是通过向量化混合模式计算来解决的,”据Habalov和Weißer称。由于Safari浏览器的混合模式操作已经被矢量化,所以,Safari的CSS3 mix-blend-mode特性实现不会受到该漏洞的影响。

除此之外,另一位名叫Max May的研究人员也独立发现了该漏洞,并于2017年3月向Google提交了相应的报告。

如果本篇文章对你有帮助,欢迎给个star

原文链接:https://www.bleepingcomputer.com/news/security/css-is-so-overpowered-it-can-deanonymize-facebook-users/

更多内容欢迎关注前端玩法


以上是关于黑客如何利用CSS mix-blend-mode在firefox和chrome中获取Facebook用户信息的主要内容,如果未能解决你的问题,请参考以下文章

CSS3制作文字背景图

html css mix-blend-mode

CSS3混合模式mix-blend-mode/background-blend-mode简介

mix-blend-mode: multiply - Firefox 黑色 bug

神奇的CSS3混合模式

神奇的 CSS,让文字智能适配背景颜色