Link with target="_blank" and rel="noopener noreferrer" still vulnerable?
You may be misunderstanding the vulnerability. You can read more about it here: https://www.jitbit.com/alexblog/256-targetblank---the-most-underestimated-vulnerability-ever/
Essentially, adding rel="noopener noreferrer"
to links protects your site's users against having the site you've linked to potentially hijacking the browser (via rogue JS).
You're asking about removing that attribute via Developer Tools - that would only potentially expose you (the person tampering with the attribute) to the vulnerability.
Update as of 2021: All current versions of major browsers now automatically use the behavior of rel="noopener"
for any target="_blank"
link, nullifying this issue. See more at chromestatus.com.
Browsers fix
All major browsers have fixed this issue by updating the default behaviour to be secure without having to specify rel
property. Read more in About rel=noopener.
- Chrome fixed it at v88
- Safari fixed it in 2016!
- Firefox fixed it at v52
- New Edge is Chromium based, so fixed too
Regarding the Lighthouse Best Practices audits report:
Add
rel="noopener"
orrel="noreferrer"
to any external links to improve performance and prevent security vulnerabilities.
In general, when you use target="_blank"
, always add rel="noopener"
or rel="noreferrer"
:
For example:
<a href="https://www.kaiostech.com/store/" target="_blank" rel="noreferrer">
KaiStore
</a>
rel="noopener"
prevents the new page from being able to access thewindow.opener
property and ensures it runs in a separate process.rel="noreferrer"
has the same effect but also prevents theReferer
header from being sent to the new page.
See the official document for more information.
Links with target="_blank"
on them are vulnerable to having the referrer page being swapped out in the background while the user's attention is diverted by the newly-opened tab. This is known as reverse tabnapping:
The referring page is stored in window.opener
, and a malicious site could modify this through:
if (window.opener) {
window.opener.location = "https://phish.example.com";
}
Adding rel="noopener noreferrer"
fixes this vulnerability in all major browsers.
Note that you could theoretically remove the rel
client-side through manipulation... but why would you want to? All you are doing is deliberately making yourself vulnerable to the attack.
Other users who visit the same website (and don't modify their own client-side code) would still be safe, as the server would still serve up the rel="noopener noreferrer"
. Your removal of it only applies to you.