TIPS

rel属性の「noopener」の重要性。target=”_blank”とrel=”noopener”をセットで使うことにしました。

2016.11.8

2017/11/08

TOPhtmlrel属性の「noopener」の重要性。target=”_blank”とrel=”noopener”をセットで使うことにしました。

あるサイトを閲覧していてリンクをクリックすると別ウィンドウでページが開き、元のページが他のサイトに遷移していることがありました。

 

気になったので、調べてみると

javascriptで元ページを入れ替えているとのことでした。

window.opener.location = newURL

 

たった一行ですが、悪用される恐れは十分あります。

そこで対策は<a>タグの属性に「rel=noopener」を追加するということでした。

 

<a href="http://example.com" target="_blank" rel="noopener">
   Example site
</a>

 

もっと詳しい内容は下記のサイトにありましたので、ご参考までに。

■The performance benefits of rel=noopener – JakeArchibald.com

https://jakearchibald.com/2016/performance-benefits-of-rel-noopener/