基本情報 †
同一オリジンポリシーが適用されるケース †
- JavaScript での非同期通信（Ajax, いわゆる XMLHttpRequest? や Fetch API を使った通信）
- CSS での @font-face を使った Web フォントの読み込み
- WebGL テクスチャの読み込み
- canvas の drawImage() を用いた画像やビデオフレームの描画
- 画像から CSS シェイプの生成
同一オリジンポリシーが適用されないケース †
- <img> タグの src 属性で読み込んだ画像
- <link> タグの href 属性で読み込んだ CSS
- <script> タグの src 属性で読み込んだ JavaScript
- <form> タグの action 属性で設定した送信先 URL
- <video>, <audio> タグの src 属性で読み込んだマルチメディアファイル
- <iframe>, <frame> タグの src 属性での別サイトコンテンツの読み込み
リクエストの種類 †
- 同一オリジンポリシーによって制限が発生するかは、通常「シンプルリクエスト」であるかどうかで決まる
- シンプルリクエストでなかった場合、ブラウザのセキュリティチェックフローに則って、プレフライトリクエストを交えたリクエストフローが実施される
シンプルリクエスト †
以下の条件すべてに合致するリクエスト。
- リクエストのメソッドが GET, POST, HEAD のいずれかに設定されている場合
- Content-Type ヘッダーが application / x-www-form-urlencoded , multipart / form-data , text / plain のいずれかに設定されている場合
- 以下の一般的なヘッダのみで、特殊なヘッダが存在しない場合
- Accept
- Accept-Language
- Content-Language
- DPR
- Downlink
- Save-Data
- Viewport-Width
- Width
プリフライトリクエスト †
以下の条件のいずれかに合致するリクエスト。
- リクエストのメソッドがGET, POST, HEAD でない場合
- Content-Type ヘッダーが application / x-www-form-urlencoded , multipart / form-data , text / plain のいずれでもない場合
- シンプルリクエストで許可されたリクエストヘッダ以外が付与されている場合
解決策 †
Proxy経由 †
抜け道 †
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
