JavaScriptの同一オリジンポリシー 調べてみた

これなに

JavaScriptのサンドボックスの機能の1つである同一オリジンポリシーを調べてみました。

同一オリジンポリシーは、ブラウザ内でサイトをまたがったアクセスを禁止することでブラウザのセキュリティを高める機能の1つです。

今回は、同一オリジンポリシーの概要などをまとめていきたいと思います。

サンドボックスとは

同一オリジンポリシーの内容に入る前に、サンドボックスに関して解説します。

サンドボックスとは、マルウェアなど悪意のあるプログラムをPCやブラウザ内に入れないようにする仕組みのことです。

PCやブラウザはファイルをダウンロードしたり、Webサイトを閲覧したりすることでプログラムを実行します。

その際に、実行して始めて悪意のあるプログラムかどうかが判断できる場合があります。しかし、悪意のあるプログラムを実行してしまったら一大事です。

そこで、サンドボックスを利用します。

サンドボックスは、プログラムの実行領域内にサンドボックス専用の領域を作成し、そこで悪意がある可能性のあるプログラムを実行します。そして、プログラムに悪意があった場合は、実行結果を破棄する等などで実際の実行領域に影響がないようにします。

こうすることで、プログラムに悪意があった場合も実行領域が攻撃される可能性を低くします。

同一オリジンポリシーとは

本題です。

同一オリジンポリシーとは、JavaScriptなどのクライアントスクリプトで異なるオリジンへのアクセスを制限するセキュリティ上の仕組みになります。

同一オリジンポリシーにより、攻撃者の罠サイトにアクセスした際にあるサイトの個人情報を盗み取られるなどのいわゆる「受動的攻撃」を防ぐことができます。

オリジンとは

さっきから説明しているオリジンとなんぞやという話です。

オリジンとは、ウェブコンテンツを識別するためのものだとイメージしてください。（あくまでイメージで、厳密には違います。）

オリジンを構成する要素は、

• スキーム（プロトコル）
• ドメイン
• ポート番号

の3点です。この3点が全く同じ場合、同一オリジンとみなされます。

つまり同一オリジンポリシーとは、同じプロトコル（例えばhttps）で同じドメイン（例えばtech-tech.blog）で同じポート番号（例えば80番）のコンテンツしかアクセスを許可しませんよという考え方になります。

同一オリジンポリシーの必要性

では、なぜ同一オリジンポリシーが必要になるのでしょうか

一言で言えば、別の見知らぬサイトに情報を抜き取られないようにするためにあります。

具体的に説明します。

Aサイトというログインが必要なサイトにログインしていたとします。

その状態で、B罠サイトという攻撃者が作成した罠サイトにアクセスをします。（Aサイトとは異なるオリジンという前提です）

この時に、B罠サイトにAサイトを参照してログイン情報や個人情報を抜き取るというJavaScriptのプログラムが仕掛けられていたらどうでしょう。

ただサイトを閲覧しただけなのに情報が抜き取られてしまってひとたまりもありません。（それが攻撃なのですが・・・）

ここで、必要になるのが同一オリジンポリシーです。

同一オリジンポリシーによって、B罠サイトからAサイトのコンテンツにアクセスすることができません。これで、情報が抜き取られることはなくなります。

同一オリジンポリシーの対象

以下が同一オリジンポリシーの対象範囲となります。

• Canvas
• X-Frame-Options
• Web Storage
• XMLHttpRequest
• ifame（ドキュメントへのアクセスのみ）

CSSやJavaScriptの読み込みなどは、同一オリジンポリシーの制約を受けないので別オリジンからでも読み込みが可能です。

以上！！！！！！！

参照

「体系的に学ぶ安全なWebアプリケーションの作り方」徳丸 浩著

https://qiita.com/ymbn/items/cc69dc3eccf5a13bbeed

https://qiita.com/tkek321/items/bd36b1541d22c8645eb9

https://developer.mozilla.org/ja/docs/Glossary/Origin