Use window.open but block use of window.opener

Machavity picture Machavity · Nov 14, 2016 · Viewed 24.3k times · Source

A while back I ran across an interesting security hole

<a href="http://someurl.here" target="_blank">Link</a>

Looks innocuous enough, but there's a hole because, by default, the page that's being opened is allowing the opened page to call back into it via window.opener. There are some restrictions, being cross-domain, but there's still some mischief that can be done

window.opener.location = 'http://gotcha.badstuff';

Now, HTML has a workaround

<a href="http://someurl.here" target="_blank" rel="noopener noreferrer">Link</a>

That prevents the new window from having window.opener passed to it. That's fine and good for HTML, but what if you're using window.open?

<button type="button" onclick="window.open('http://someurl.here', '_blank');">
    Click Me
</button>

How would you block the use of window.opener being passed here?

Answer

G0BLiN picture G0BLiN · Oct 26, 2017

The window.open() call now supports the feature "noopener".
So calling window.open('https://www.your.url','_blank','noopener') should open the new window/tab with a null window.opener.

I'm having trouble finding a reliable list of supporting browsers (and versions) - MDN states here that

This is supported in modern browsers including Chrome, and Firefox 52+.

From my experimentation, I see it works for:

  • Chrome 61
  • FireFox 56
  • Safari 11.1 (thanks Jiayi Hu for this)

But doesn't work for:

  • IE 11.608
  • Edge 40

(All tests on a PC running Windows 10...)

For backwards compatibility it may be better to combine this with t3__rry's answer.