危险的 target="_blank"

前端基础,大前端 2018-09-27

起步

在某篇博文[传送门]中提到的 target="_blank" 的安全性并称它是 “有史以来最被低估的漏洞”。这个属性给钓鱼者带来了可乘之机。

14728001871414.png

利用

这个属性是怎么被利用的呢?在说这个之前我想先说说 <iframe> ,在 iframe 展示的页面中,可以通过 window.parent 来获得父级页面的 window 对象。而在 target="_blank" 的页面中,也是可以通过 window.opener 来获得来源页的 window 对象。

这就很可怕了,如果在目标页面:

window.opener.location ='https://fakewebsite/facebook.com/PHISHING-PAGE.html';

攻击者利用一个伪造的Facebook页面来替换原始的Facebook网页,然后要求用户重新输入用户名和密码。这样一来,攻击者便成功获取到了目标用户的凭证数据。

注:有的现代浏览器在安全策略里面,会在新页面使用将 opener 属性设为 null

修复

修复这个问题也很简单,只要在链接标签里面再加个 rel="noopener"

<a href="http://domain.com" target="_blank" rel="noopener">site</a>

火狐不支持 noopener ,它应该使用 rel="noopener noreferrer"

还能提升性能

rel="noopener" 还能提升性能。有人做了个随机数测试,这里的随机数类似当前页面的生命体征。如果并不是每一帧都能生成随机数,说明有东西阻塞了线程。

没有 rel="noopener" ,随机数会被新打开页面中的 JavaScript 阻断。不仅如此,所有主线程活动也会被阻塞,试试选择页面中的文本。但加了 rel="noopener" 之后,随机数生成一直保持在 60fps 。当然,是在Chrome或Opera中。


本文由 hongweipeng 创作,采用 知识共享署名 3.0,可自由转载、引用,但需署名作者且注明文章出处。

如果对您有用,您的支持将鼓励我继续创作!