Link with Target="_Blank" and Rel="Noopener Noreferrer" Still Vulnerable

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.

Is rel= noreferrer needed when the target is a custom framename?

Use noopener,noreferrer, _blank just opens an unnamed window

The target attribute is used as a window name. If you refer to the same target multiple times, that window gets replaced with the new URL.

This will not solve the security issue.

Here is some more info: https://owasp.org/www-community/attacks/Reverse_Tabnabbing
You can try out the example given in that article.

Use noopener,noreferrer first. But secondly, don't link to malicous sites /p>

Why do links with rel= noopener noreferrer always open in a new tab?

but why does it open in a new tab?

Seems to be specified that way, https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types says:

Note that when noopener is used, nonempty target names other than _top, _self, and _parent are all treated like _blank in terms of deciding whether to open a new window/tab.

My guess - with a different tab name specified by the application itself, there’s probably concerns that some sort of info that is not supposed to leak, could leak nonetheless - for example if a different script opened a tab with that name first, but without noopener - then it could have a reference to that tab, and still use that reference to access the contents later on, when the user opens a link that explicitly has noopener set.

Is there anything I can do to keep the original behaviour even if rel="noopener noreferrer" is added to the links.

That would likely undermine the security this feature is supposed to provide in the first place.

You can try and have a JS run over your document after it is loaded though, and have it remove the rel attribute from those links, resp. remove the noopener part from its value.

Then you would of course not get any of the “protection” this feature provides, but opening the links all in the same tab should still work.

---

Edit: A simple way to set the attribute value to an empty string for all links that have this particular target set, would be

document.querySelectorAll('[target="webapp-tab"]').forEach(function(e) { e.rel = ''; } )

(Make sure to execute that after the document has loaded, of course.)

Use window.open but block use of window.opener

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.

Form value creates a url with target blank and rel nofollow noopener noreferrer

There are two approaches to get the submission response page/action page to open in a new window:

1. change your location.href call to a window.open call; refer to https://developer.mozilla.org/en-US/docs/Web/API/Window/open for documentation on using window.open

OR...

2. instead of loading the url in your javascript, set the form action attribute in the tag and also set a target of _blank in the same tag. Use your javascript function to return true to submit the form to the action url or return false to prevent submission.

Then, too set a nofollow behavior for the new page that the form action directs too, you can either disallow its indexing in robots.txt or add a metatag, as noted in the answer here: https://webmasters.stackexchange.com/questions/13837/nofollow-in-a-form-action

target= _blank vs. target= _new

Use "_blank"

According to the HTML5 Spec:

A valid browsing context name is any string with at least one character that does not start with a U+005F LOW LINE character. (Names starting with an underscore are reserved for special keywords.)

A valid browsing context name or keyword is any string that is either a valid browsing context name or that is an ASCII case-insensitive match for one of: _blank, _self, _parent, or _top." - Source

That means that there is no such keyword as _new in HTML5, and not in HTML4 (and consequently XHTML) either. That means, that there will be no consistent behavior whatsoever if you use this as a value for the target attribute.

Security recommendation

As Daniel and Michael have pointed out in the comments, when using target _blank pointing to an untrusted website, you should, in addition, set rel="noopener". This prevents the opening site to mess with the opener via JavaScript. See this post for more information.

Is it alright to use target= _blank in HTML5?

It looks like target="_blank" is still alright. It is listed as a browsing context keyword in the latest HTML5 draft.

---

Related Topics