rel=noopener2021 update: Browsers now implicitly set rel=noopener for any target=_blank link, following a spec change. If the demo on this page no longer seems scary, congratulations — you’re using a modern browser!
You’re currently viewing index.html.
Imagine the following is user-generated content on your website:
Click me!!1 (same-origin)Clicking the above link opens malicious.html in a new tab (using target=_blank). By itself, that’s not very exciting.
However, the malicious.html document in this new tab has a window.opener which points to the window of the HTML document you’re viewing right now, i.e. index.html.
This means that once the user clicks the link, malicious.html has full control over this document’s window object!
Note that this also works when index.html and malicious.html are on different origins — window.opener.location is accessible across origins! (Things like window.opener.document are not accessible cross-origin, though; and CORS does not apply here.) Here’s an example with a cross-origin link:
In this proof of concept, malicious.html replaces the tab containing index.html with index.html#hax, which displays a hidden message. This is a relatively harmless example, but instead it could’ve redirected to a phishing page, designed to look like the real index.html, asking for login credentials. The user likely wouldn’t notice this, because the focus is on the malicious page in the new window while the redirect happens in the background. This attack could be made even more subtle by adding a delay before redirecting to the phishing page in the background (see tab nabbing).
TL;DR If window.opener is set, a page can trigger a navigation in the opener regardless of security origin.
To prevent pages from abusing window.opener, use rel=noopener. This ensures window.opener is null in Chrome 49 & Opera 36, Firefox 52, Desktop Safari 10.1+, and iOS Safari 10.3+.
rel=noopener)
For older browsers, you could use rel=noreferrer which also disables the Referer HTTP header, or the following JavaScript work-around which potentially triggers the popup blocker:
var otherWindow = window.open();
otherWindow.opener = null;
otherWindow.location = url;rel=noreferrer-based workaround)
Click me!!1 (now with window.open()-based workaround)
Note that the JavaScript-based work-around fails in Safari. For Safari support, inject a hidden iframe that opens the new tab, and then immediately remove the iframe.
Don’t use target=_blank (or any other target that opens a new navigation context), especially for links in user-generated content, unless you have a good reason to.
In Safari Technology Preview 68, target="_blank" on anchors implies rel="noopener". To explicitly opt-in to having window.opener be present, use rel="opener". This behavior was later standardized.
target="_blank" imply rel="noopener"Questions? Feedback? Tweet @mathias.