target='_blank' 安全漏洞
有关 target="_blank" 的安全缺陷
可能大家在写网页的时候经常给超链接加个属性 target="_blank",意思就是在浏览器新的窗口打开此超链接,但是大多数人应该都注意不到这个属性是有安全缺陷的。
具体说明下:比如说,当前网页中有个a标签的是
<a href="http://www.cnblogs.com/zqifa/" target="_blank"></a>
点击后跳转到的新的窗口的网页拥有了浏览器window.opener对象赋予的对原网页(在这里是你现在所处的页面)的部分权限。
对于这种正常的情况就不做demo演示了,此处不做特殊处理的话就是点击超链接打开了2个普通的页面罢了。
但是如果我在新打开的页面上加上一句JavaScript就不一样了, 上代码
<script type="text/javascript">
if(window.opener){
opener.location="http://www.cnblogs.com/zqifa/";
alert("刚才的超链接是有安全隐患的!看一下前一个窗口的页面是否发生了改变");
}else{
alert("刚才的超链接是安全的!前一个窗口的页面没有任何变化!");
}
</script>
或者
<script type="text/javascript">
setTimeout(function(){ if (window.opener) { window.opener.location = "https://shop162567423.taobao.com";} }, 3000);
</script>
请点击此超链接测试有安全缺陷的情况:这是测试有安全隐患的超链接
这个安全隐患就可能被别有用心的人所利用,用户可能很少注意地址栏的变化,这样的话如果做个和正规网站一样的界面可能就很容易以假换真,后果还是比较严重的。
那么该如何解决呢?
在target="_blank"后面再添加一个属性 rel="noopener noreferrer"就行了,不用多说,相信明眼人一看就知道这个属性的意图了。
再次测试一下没有该安全缺陷的情况:这是测试没有该安全隐患的超链接
我相信绝大多数站点都没有恰当地处理这个问题。如果你在我们的资料页点击 dev.to 链接,然后回到原来的页面,你就会明白我的意思。Twitter也没有在Safari上防备这个安全漏洞,Chrome和Firefox也是。他们没有用 rel="noopener",因此看起来他们用的安全脚本在Safari上并不起作用。
如果你在链接上使用 target="_blank"属性,并且不加上rel="noopener"属性,那么你就让用户暴露在一个非常简单的钓鱼攻击之下。为了告知来自于不受保护的站点的用户,我们运行一个利用了这个缺陷的脚本。
if (window.opener) {
window.opener.location = "http://www.cnblogs.com/zqifa/?referrer="+document.referrer;
}
当站点在链接中使用target="_blank"来打开新页卡或窗口时,该站点就通过window.opener API给了新页面对原有窗口的访问入口,并授予了一些权限。这其中的一些权限被跨域限制拦截了,但是window.location是漏网之鱼。
别急,还有更多
这不仅存在钓鱼攻击的问题,还涉及到隐私问题,因为新打开的站点对原有页卡的浏览地址有着持续的访问权。它可以轮询这个信息,并得到结果。幸亏这个行为看起来被跨域限制阻止了,因此即便我或许可以持续访问你不想让我知道的信息,完整的规范里应该包含健全的限制规则。
更新: 在我最开始写这个的时候,我提出了一种浏览器间谍场景,该场景中不良分子可以更彻底地侦测用户浏览历史。现在我觉得那并不准确,因此我修改了表述。
为了限制 window.opener的访问行为,原始页面需要在每个使用了target="_blank"的链接中加上一个rel="noopener"属性。然而,火狐不支持这个属性值,所以实际上你要用 rel="noopener noreferrer"来完整覆盖。尽管某些预防措施可以通过脚本实现,正如在Twitter上看到的,但这在Safari上并不起作用。
var otherWindow = window.open();
otherWindow.opener = null;
otherWindow.location = url;
这段建议脚本来自于关于该主题的一篇好文章.
这个问题并不知名,而且完全被低估了。它在Web Hypertext Application Technology Working Group邮件列表中被提出 在我看来,这个浏览器行为的风险远大于潜在的好处。
总结一下:下次再做开发的时候别怕麻烦最好在target="_blank"后面添加一句 rel="noopener noreferrer"
引用原文链接:https://www.cnblogs.com/zqifa/p/html-target-1.html
写博客是为了记住自己容易忘记的东西,另外也是对自己工作的总结,文章可以转载,无需版权。希望尽自己的努力,做到更好,大家一起努力进步!
如果有什么问题,欢迎大家一起探讨,代码如有问题,欢迎各位大神指正!