noopenerはもう要らねェ…！

(某海軍大将のようなセリフですみません)

HTMLやJavaScriptを書いていると、aタグを使って別タブでリンクを開きたくなる場面があると思います。

aタグ

<a href="https://example.com" target="_blank">

2023年くらいまでの記事では、
「rel="noopener"を指定しないとタブナビング攻撃を受けるよ！」
という内容を見かけると思います。
しかし、現在は主要なブラウザ側で対策されているため、設定は不必要となります。
（内容としては今更感がありますが、自身の備忘録のためにまとめます）

タブナビング攻撃

まずタブナビング攻撃とは、現在アクティブになっている(見ている)タブから、他のアクティブになっていない（見ていない）タブのページの内容を変更する攻撃のことです。

こちらのサイトの具体例わかりやすいです。
https://denno-lab.com/target-blank-safety/

つまり、target="_blank"によって新しいタブを開くと、
新しく開いたタブからwindow.openerを操作して、元のウィンドウの内容を変更できてしまう、ということのようです。

window.openerについてはこちらから
https://developer.mozilla.org/ja/docs/Web/API/Window/opener

noopenerの役割

ここでnoopenerを指定することにより、window.openerがnullになります。
window.openerがnullになると元のウィンドウを参照することができなくなるので、元のウィンドウの内容を変えることもできなくなる（タブナビング攻撃を防げる）ということのようです。

MDNを見たところ

しかし、MDNを見たところ、target="_blank" を aタグに設定するとデフォルトでwindow.openerを設定しないようにしてくれるそうです。
（つまり、noopenerを設定したのと同じ振る舞いになります）

メモ: target="_blank" を <a> 要素に設定すると、暗黙的に rel の動作が rel="noopener" を設定した場合と同様、 window.opener を設定しないようになりました。対応状況についてはブラウザーの互換性を参照してください。

互換性の部分を見ても主要なブラウザに対応しているみたいなので、やはりnoopenerは不必要そうだと考えて良さそうですね。

window.open()メソッドは？

しかし、調べた感じだと指定したリンクを開くwindow.open()を使用する場合はnoopenerを設定する必要があるかも？と考えています。

https://momdo.github.io/html/window-object.html
https://developer.mozilla.org/ja/docs/Web/API/Window/open

window.open()はデフォルトでtarget='_blank'を指定するようなのですが、第3引数のwindowFeaturesについては特に触れられていなさそうです。
window.open()メソッドを使う場合は、明示的にnoopenerを指定した方が安心かもしれません。
（この辺りご存知の方いらっしゃれば教えてください）

まとめ

2025年現在では、aタグにrel="noopener"を指定しなくてもブラウザ側でタブナビング攻撃対策をしてくれるよ、というお話でした。

あとこちらの記事も大変参考になりました。
ありがとうございます。
参考：https://cinci.jp/blog/20240723-review-target-blank-noopener-noreferrer-practices