Machavity
Machavity

Reputation: 31614

Use window.open but block use of window.opener

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?

Upvotes: 62

Views: 83947

Answers (6)

Daniel Danielecki
Daniel Danielecki

Reputation: 10512

UPDATE: target="_blank" implying rel="noopener" behavior has been proposed in #4078 and fixed in PR#4330 on 31.01.2019

Most modern browsers have incorporated this change, but mostly those are the newest versions. Source: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#browser_compatibility

Upvotes: 0

I.G. Pascual
I.G. Pascual

Reputation: 5965

Pointing out that it's a comma separated list of features (no whitespaces), so you could set 'noopener,noreferrer,resizable' i.e.:

window.open('http://sensible.url', '_blank', 'noopener,noreferrer,resizable')

From Mozilla docs:

windowFeatures Optional

A DOMString containing a comma-separated list of window features given with their corresponding values in the form "name=value". [...]

Upvotes: 21

t3__rry
t3__rry

Reputation: 2849

Use

var yourWindow = window.open();
yourWindow.opener = null;
yourWindow.location = "http://someurl.here";

Credit goes to Mathias Bynens: https://mathiasbynens.github.io/rel-noopener/

Upvotes: 34

Vincent Verrier
Vincent Verrier

Reputation: 241

According to the documentation (https://developer.mozilla.org/en/docs/Web/API/Window/open), in the following code

window.open('https://www.your.url','_blank','noopener')

The third argument contains the "WindowFeatures" (see https://developer.mozilla.org/en-US/docs/Web/API/Window/open#Window_features) so it makes sense that it opens the target in a new window

Upvotes: 11

G0BLiN
G0BLiN

Reputation: 1004

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.

Upvotes: 104

Chet
Chet

Reputation: 19839

This worked for me:

const a = document.createElement("a")
a.href = args.url
a.target = "_blank"
a.rel = "noopener"
a.click()

Upvotes: 8

Related Questions