tldr; Remember to use
target="_blank" links where you do not control the destination.
Let’s run through an example - then I’ll show the code.
First, either you specifically create a link or you allow someone using your site to create a link. The link opens in a new tab to a different domain. You’ve accomplished this by saying
Then, the malicious new open tab redirects the
window.opener to a site that looks a lot like yours but asks for a login. It might put a note on top that says “You’ve been signed out for inactivity” - which makes perfect sense if you think about it. The user was on a new tab - maybe they were there for a long time.
Finally, the user logs into the phishing site, then the phishing site redirects them back to your previous page (remember, they had the
referer) and everything looks good - because the user wasn’t actually logged out anyway. For bonus points - with a misconfigured website - they might indicate that you’ve successfully logged in using a
Let’s take a look at how this code works.
Cool thing <a href="https://two.com" target="_blank">click here</a>.
<p>I can haz redirect your previous tab.</p>
window.opener.location = 'https://looks-like-one.com';
And boom, your previous tab is redirected to a site that looks like it’s one.com but it’s not.
The solution to this is very simple. Whether coding your own links or parsing/sanitizing users’ input, we can solve this with rel noopener.
<a href="https://two.com" target="_blank" rel="noopener">click here</a>.
Now, the destination page does not have access to
window.opener and you’ve done your part.