慎用target=”_blank”

该文章由 leevare 发布于 ,归类于 HTML/CSS

在页面中如果想打开一个链接跳转到新页面,通常是采用target="_blank"的形式。

<a href="https://www.google.com" target="_blank">Google</a>

但是,这样做其实是存在安全隐患的。

如果,在A页面使用target="_blank"跳转到B页面,那么在B页面中可以通过window.opener获取到A页面中的window属性,无论跨域与否。

为了防止这个问题出现,可以给跳转的a链接添加rel="noopener"或者rel="noreferrer"属性,之后打开新页面的window.opener就是null了,此时,新的窗口将会运行在新的进程里,不会影响原来页面的进程。

<a href="https://www.google.com" target="_blank" rel="noopener">Google</a>

如果觉得我的文章对您有用,请您随意打赏。您的支持将鼓励我更加努力创作!

相关文章:

订阅
提醒
guest
1 评论
Inline Feedbacks
View all comments
了然如一
了然如一
1 月 之前

之前发现WordPress自动加了,一直没注意这noopener的属性原来是这个作用~666.