html中<a>标签的安全问题!

226 阅读1分钟
1、问题描述
<a href="https://learn-anything.cn" target="_blank"/>

# 上面的写法,会出现下面的警告信息:
warning  Using target="_blank" without rel="noreferrer" is a security risk: see
https://html.spec.whatwg.org/multipage/links.html#link-type-noopener  react/jsx-no-target-blank
2、解决方案
# 增加属性:rel="noreferrer"
<a href="https://learn-anything.cn" target="_blank" rel="noreferrer"/>
3、安全问题说明

使用 target="_blank" 打开新标签页时,新页面的 window.opener 对象指向前一个页面,也就可以控制前一个页面。

  • 当新旧页面在同一个域名下时,在新页面控制台输入 window.opener.alert(1) ,会发现旧页面弹出消息 1
  • 当新旧页面不在同一个域名时,通过 window.opener.location.replace 可以改变旧页面的url。
  • rel="noreferrer" 属性是把 window.opener 对象设置为 null,以防后患。

4、相关链接