Security risk for opening new tabs or windows

 4 years ago
source link: https://www.tuicool.com/articles/hit/fEBbUrE
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.


Today eslint reports an error when I introduce eslint-plugin-react

error  Using target="_blank" without rel="noopener noreferrer" is a security risk: see https://mathiasbynens.github.io/rel-noopener  react/jsx-no-target-blank


Opening a new tab/window, either by hyperlinks (i.e <a> tag with target attribute set to _blank ) or programmatically calling window.open , will grant the newly-opened tab/window access back to the originating tab/window via window.opener . Therefore, the newly opened tab/window can then change the window.opener.location to redirect to the phishing page in the background, or execute some JavaScript on the opener-page on your behalf.

How to fix

Add rel="noopenner" to outgoing links. E.g.

<a href="https://abc.com" target="_blank" rel="noopener">
window.open('https://abc.com', 'security', 'noopener');
  • Reset opener property

Note: this technique is subject to Same Origin Policy

let nw = window.open('https://abc.com', 'security');
nw.opener = null;



  • If you want to follow the latest news/articles for the series of my blogs, Please 「Watch」 to Subscribe.

About Joyk

Aggregate valuable and interesting links.
Joyk means Joy of geeK