ウェブアプリケーションが発展し、同一オリジンポリシーの制限を超えてデータのやり取りを行いたいというニーズが増えてきました。 その際サイトを超えたデータのやり取りに関する仕様として策定されたのがCORSです。
同一オリジンポリシー
同一オリジンではない、他のサイトへのアクセスを制限するもので、同一オリジンである条件は以下を満たすもの。
- ホストが一致している
- スキームが一致している
- ポート番号が一致している
異なるオリジンからの読み出しを許可する
異なるオリジンからの読み出しを許可するためには、Access-Control-Allow-Origin
というヘッダーを情報の提供元がHTTPレスポンスヘッダに付与する必要があります。
プリフライトリクエスト
読み出し(GETメソッド)などのシンプルなリクエストの場合には上記のようにAccess-Control-Allow-Origin
を付与すれば問題ありませんでした。
しかしシンプルなリクエストではない場合には、ブラウザは異なるオリジンに対し、プリフライトリクエストを送信します。
シンプルなリクエストである条件は以下を満たすもの
メソッド
- GET
- HEAD
- POST
リクエストヘッダ
- Accept
- Accept-Language
- Content-Language
- Content-Type
Content-Type
- application/x-www-form-urlencoded
- multipart/form-data
- text/plain
上記のリクエスト以外はプリフライトリクエストというHTTPリクエストを送ります。
認証を含むリクエスト
デフォルトでは異なるオリジンに対するリクエスト内に、HTTP認証やクッキーなどの認証に用いられるリクエストヘッダは送信されません。認証を含むリクエストを行うには以下を満たす必要があります。
- リクエスト側は、XMLHttpRequestの
withCredentials
プロパティをtrueにする。 - レスポンス側は、
Access-Control-Allow-Credentials
レスポンスヘッダーをtrueにする。
参考ページ