まず結論
【 target=”_blank” 】は、現在、W3CのHTML Living Standardにおいては非推奨とされているわけではありません。
XHTMLでは非推奨とされていたようですが、HTML5においては非推奨とはされていないようです。
しかしながら、セキュリティ上の観点から使わない方がよいとされています。
【 target=”_blank” 】とは
【 target=”_blank” 】を指定するとリンク先が別タブでひらきます。
もしこの指定がなければ大変不便です。
例えば、フォームを入力中にちょっと気になったバナーをクリックします。
その時、同一ウィンドウで別サイトが表示されてしまい、今まで入力したフォームの内容が失われ、再び最初から入力し直すはめに…
別タブ表示になぜしてくれなかったのか…
こんなガッカリ案件が多発することでしょう。
このなくてはならない【 target=”_blank” 】が、非推奨とされていないとは言え、なぜ、使わない方がよいとされているのでしょうか？
脆弱性
その理由のひとつに【 target=”_blank” 】の脆弱性があげられます。
その脆弱性をついてしかけてくる攻撃のひとつに【 Tabnabbing（タブナビング）攻撃 】というものがあります。
この攻撃では【 target=”_blank” 】で開いた新しいウィンドウの元のウィンドウを別のサイトへナビゲートします。
ユーザー環境によってはポップアップブロックが機能して【 target=”_blank” 】で開きたいウィンドウが開かない場合がありますが、この攻撃では新しいウィンドウではなく元のウィンドウにしかけられます。
ポップアップブロックが機能して新しいウィンドウは防げても既存のウィンドウに対しては機能せず、攻撃を防ぐことができません。
その時に使われるコマンドが以下のJavaScriptです。
window.opener.location="URL"これを実行すると元ウィンドウが ”URL” へ飛ばされてしまいます。
例えば、元のウィンドウが偽のどこかのアカウントログイン画面に遷移されて、偽サイトとは気づかずにユーザーIDとパスワードを入力してログインしてしまうかもしれません。その時にユーザーIDとパスワードはもちろん、そこから様々な個人情報が引き出されてしまうかもしれないのです。
対策
これらを防ぐには、【 noopener 】 と 【 noreferrer 】 で元ウインドウを参照させないようにします。
使い方の例としては以下の通りです。
<a href="URL"
target="_blank" rel="noopener noreferrer">リンク先</a>このようにrel属性を追加します。
【rel=”noopener”】がwindow.openerのコマンドを無効化します。
別ウィンドウではJavaScriptのエラーとなり、元リンクタブは切り替わりません。
【noreferrer】は【noopener】の代替えです。【noopener】の効かないブラウザ、IE11などのユーザーのためにつけておきましょう。
まとめ
現在ではブラウザ側の対策もすすんでおり、上記の記述をしなくても【 Tabnabbing（タブナビング）攻撃 】を防ぐようになっていますが、油断は禁物です。
セキュリティに関する問題は常に進化してます。ブラウザは最新のものを使用し、できる対策は常にしておきましょう。