Same-Origin Policy（同一オリジンポリシー）は、別のオリジンから来た情報を、ブラウザ上のスクリプトが勝手に読めないようにするブラウザの基本ルールです。 Webのセキュリティはこの壁を土台に組み立てられており、CORS はこの壁に「許可した相手だけ通す門」を開ける仕組みです。
オリジンは3点セット
オリジンは「スキーム＋ホスト＋ポート」の組で決まります。1つでも違えば別オリジンです。
| URL | https://example.com と同一？ |
|---|---|
https://example.com/page2 |
同一（パスは関係ない） |
http://example.com |
別（スキームが違う） |
https://api.example.com |
別（ホストが違う） |
https://example.com:8080 |
別（ポートが違う） |
「サブドメインだから同じでしょ」が通らないのが最初のつまずきポイントです。
何が禁止で、何が許されているか
- 禁止 … 別オリジンへ
fetch/XHR した応答を読み取ること。別オリジンの iframe の中身へアクセスすること - 許可 …
<img><script><link>で別オリジンのリソースを埋め込んで使うこと（昔からのWebの仕組みなので許されている）
「読めないだけで、送ること自体はできてしまう」——ここが重要です。
なぜ必要か、そして何を防がないか
この壁がないと、悪意あるサイトを開いただけで、そのページのスクリプトがあなたのログイン済みの銀行やメールの中身を読み取れてしまいます。それを防ぐのが Same-Origin Policy です。 一方で、CSRF は防ぎません。CSRF は「勝手にリクエストを送らせる」攻撃で、応答を読む必要がないからです。「SOPがあるからCSRF対策は不要」は典型的な誤解で、CSRFトークン等の対策は別途必要です。
近い用語との違い
- CORS … この制約を、サーバー側の宣言で選択的に緩める仕組み
- Preflight request … その緩めてよいかの事前確認
- CSP（Content-Security-Policy） … 読み込んでよいリソースを制限する別のヘッダー。方向が逆
全体像は CORSとは？初心者向けガイド で扱っています。