【HTML】危ない！
「target="_blank"」で安全に外部リンクを書く方法

HTMLでリンクを書くとき、いつもなんて記述していますか？

特に外部サイトへリンクする時などは、リンク先を新しいウィンドウで開く「target="_blank"」を使うことも思います。

今回は、外部リンクなどでお馴染みの「target="_blank"」の、意外なセキュリティ上のリスクと解決策をざっくりとまとめています。

「target="_blank"」のリスクとは？

外部リンクの書き方としては、こういった記述が一般的かと思います。

<a href="URL" rel="nofollow" target="_blank">外部リンク</a>

「rel="nofollow"」はSEOでお馴染み、「ページの評価を分け与えない」という指定ですね。

信頼できないコンテンツ、有料リンク、クローラー優先順位の低いページへのリンクなどにつける事を推奨されています。

以前は外部リンクのお約束的なタグでしたが、現在では上記以外のリンク（信頼できるコンテンツ、引用元、内部リンクなど）にはつける必要はない、と言われています。

「target="_blank"」を指定すると、リンク先を新しいウィンドウで開くことが出来ます。

この「target="_blank"」。

「リンク先のJavaScript」から「リンク元のページ」のURLを変更したりできてしまうらしいのです。

例えば、リンク先のページを見て、元のページへ戻ろうとした時、元のページが別サイトにすり変わってしまう、といった操作も可能なのだとか。

うーん、別ウィンドウで開きたいだけなのに、勝手にページ操作をされるのは考えものです。

安全に「target="_blank"」を使うには？

こういったリンク先からの操作を予防するには、「target="_blank"」をつけたリンクに対して、「rel="noopener noreferrer"」を追加で設定すればOKです。

<a href="URL" rel="nofollow noopener noreferrer" target="_blank">外部リンク</a>

「rel="noopener"」は、リンクを貼ったページと、外部リンク先のページとの関係を断ち切る指定です。

「target="_blank"」で外部リンクを開いた場合でも、リンク先でのJavaScriptから干渉を受けないようにすることが出来ます。

「rel="noreferrer"」は、リファラーをユーザーエージェント（ブラウザなど）に送らない、という指定です。

リファラーというのは、あるページにリンクしているウェブページなどのアドレス情報のこと。

このリファラーを参照することで、どこから読者がやって来たかを解析することが出来ます。

つまりは、リンク先のサイトからは、どのページからリンクが貼ってあるのか、というアドレスを知ることが出来ます。

「rel="noreferrer"」とすると、リファラーを送らないので、リンク元のアドレスを伏せることが出来ます。

「target="_blank"」を使う場合、特に「rel="noopener"」は必ずセットで書いておきましょう。

Googleでもセキュリティ対策として案内されています。

参考: Tools for Web Developers｜Google

意図せぬ表示を防ぐために、できる対策はしっかりしておきたいですね。