Web

window.opener を使って元ウィンドウの情報が取得できるかどうかの実験

投稿日:2019年2月12日 更新日:

ウェブブラウザでウェブページを表示している場合、ブラウザのウィンドウを表す window というオブジェクトが存在しており、JavaScript から利用することができます。

window.opener オブジェクト

この window オブジェクトの opener というプロパティには、「自分を表すウィンドウを開いた元の window オブジェクト」がセットされます(いつでもセットされるわけではありません)。例えば、Aというページ上のリンクをクリックして、B というページを開いた場合、B から見ると A が opener ということになります。

window.opener のセキュリティ問題

もし opener が自由に使えるとなると、例えば「知らないうちに、元ウィンドウ側がフィッシングサイトに遷移されている」というように悪用される可能性も考えられます。このように opener はセキュリティの問題を多少はらんでいるため、利用できる条件が限定されているのですが、イマイチその条件が分かっていなかったため、今回いくつかの条件について試してみました。

実験の条件

調査した条件は以下の3つです。

  1. 元のページのドメインと、開くページのドメインが同じかどうか
  2. aタグに、target="_blank" がセットされているかどうか
  3. aタグに、rel="noopener noreferrer" がセットされているかどうか

ページを開く側のリンクは以下のように書きます。

1番シンプルなリンク

<a href="xxx">Link</a>

target="_blank" をセットしたリンク

<a href="xxx" target="_blank">Link</a>

更に rel="noopener noreferrer" をセットしたリンク

<a href="xxx" target="_blank" rel="noopener noreferrer">Link</a>

開いた先のページ側のHTMLは以下のようになります(一部のみ)。

<!-- 省略 -->

<!-- このボタンを押すと、ブラウザのコンソールに window.opener を出力するようにします -->
<button id="btn1">Output window.opener on console</button>

<!-- 省略 -->

<script>
window.addEventListener("load", (event) => {
  document.querySelector('#btn1').addEventListener('click', () => {
    console.log(window.opener);
  });
});
</script>

調査結果

その結果が以下の表です。

window.opener にアクセスできるかどうかの調査結果
遷移先ページのドメイン target=”_blank” rel=”noopener noreferrer” 結果
外部
(クロスドメイン)
なし 取得できない
あり 取得できない
内部 なし なし 取得できない
あり 取得できない
あり なし 取得できる
あり 取得できない

window.opener にアクセスできたのは、以下の条件が全て満たされた場合のみでした。

  • 同ドメイン
  • target="_blank" がセットされている
  • rel="noopener noreferrer" がセットされていない

この仕様であれば、window.opener を悪用するというのはかなり難しいのではないかと思います。

参考

📂-Web

執筆者:labo


comment

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

関連記事

Firefox

Firefox のコンテンツブロッキング (Enhanced Tracking Protection)

Firefox の コンテンツブロッキング 機能について説明します。

Web

シンタックス・ハイライト・ライブラリ「highlight.js」の使い方

シンタックス・ハイライト・ライブラリ「highlight.js」の使い方について説明します。

Web

Uptime Robot を使ってウェブサイトの死活監視を行う

Uptime Robot というウェブサイトの死活監視サービスの使い方を説明します。

Web

Cookie使用の同意を求めるポップアップを表示する (Cookie Consent by Osano)

Cookie Consent by Osano の使い方について説明します。

WordPress

【WordPress】JP Markdownプラグインが code タグの属性を削除する問題への対応方法

目次1. 現象2. 原因3. 対応方法 1. 現象 WordPress の JP Markdown プラグインを使っていると、以下のような (<pre> タグを伴わない単独の) <c …