【Web】同一生成元ポリシー(SOP)について

オリジンとは？

URLのことです。具体的には、スキーム（httpなど）、ホスト名、ポート番号という3つの値の組み合わせのことです。(RFC 6454で定義されています。)

オリジン間のアクセス方法の種類

リソースのブラウザ内アクセス

Fetch APIなどでリソースの中身の操作や、ウインドウへを経由したDOM操作など。

ネットワーク越しのアクセス

FetchAPIなどによるHTTPリクエストに関しては一定の制限がなされるべき。

aタグやformタグによるページ遷移（単純リクエスト）

Webの登場当初から存在しました。これはWebの基本的な利用に関わることなので、基本は制限はしない。

FetchAPIやXHRによるHTTPリクエスト（単純ではないリクエスト）

これは一定の制限を課すべきです。

なぜなら比較的最近出てきた技術なので、こういうリクエストが来ることを想定していないサイトもあるためです。

埋め込み

<iframe>や<img>タグによるページ内へのリソース埋め込み

多少は脅威はあるものの「ネットワーク越しのアクセス」に比べたら被害は少ない。

同一生成元ポリシー(SOP)

ブラウザが持っているセキュリティ機能です。

以下の内容がチェックされます。以下が一致している場合は「同一生成元のアクセス(Same-Origin)」とみなされます。

• ホスト名
• スキーム（HTTPなど）
• ポート番号

一方上記いずれかが異なる場合は「Cross-Origin」であるといいます。

SOP下での操作制限

リソース間	操作	制限
同一オリジン	ブラウザ内アクセス	なし
同一オリジン	ネットワーク越しアクセス	なし
同一オリジン	iframe埋め込み	なし
クロスオリジン	ブラウザ内アクセス	ほぼ禁止
クロスオリジン	ネットワーク越しアクセス	単純リクエストは許可、それ以外は禁止
クロスオリジン	iframe埋め込み	なし

ブラウザ内アクセス

「http://localhost:1000/aaa.html」から「http://localhost:1000/bbb.html」へのアクセスなど。

ネットワーク越しアクセス

「http://localhost:1000/aaa.html」から「http://xxxx:2000/aaa.html」へのアクセスのようにホスト名やポート番号が異なるアクセスなど。

Same-Originなら行けますが、クロスオリジンだとブラウザにブロックされてしまいます。