危険な理由

「リンクを開いた先のページでのJavaScriptによって、開いた元のページを操作できてしまう」から。
たいていのブラウザは「target=”_blank”」によって別タブで開かれたページが手前に表示され、元のページは裏側に残る。
元のページで

// window.opener は別タブで開かれたページを開いた元のページの参照を返す
window.opener.location = '~~~';

が実行されると、元のページで画面遷移が行われる。
つまりオリジンが違ったとしても、リンクを辿ってきたユーザーを任意のサイトに誘導することが可能。

対応方法

<a href="~" target="_blank" rel="noopener noreferrer">別タブで開く</a>

上記のようにrel属性を使用する。
noopenerだけでもいいが、IE11などはnoopenerに対応していないため、noreferrerも併せて指定する。
ただし、リンク先のアクセス解析でリファラを取得したい場合にnoreferrerをつけると取得できなくなるため注意。

より詳しくいうと、

noreferrerは遷移先でリファラー(document.referrer)が参照できなくなるように指定するものであり、noopenerは遷移先で遷移元ページのタブをjsで操作できなくする指定である。

GAの参照元などは、通常リファラーが参照されるため、noreferrerを指定するとdirect/noneとなることに注意する。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA