CORSについてまとめ

More than 3 years have passed since last update.


tl;dr


今北産業


  • ブラウザ上のjsが、JSONPみたいなトリックを使わずに、Same Origin Policyを越えて別ドメインのリソースと通信するための方法。

  • あらかじめサーバ側で「このドメインのjsからのGET/POSTリクエストならアクセスしていいよ」等、許可するアクセス元とアクセス手法を明示しておくと、ブラウザがドメインを越えたXMLHttpRequestを通信させてくれるようになる。

  • すべてのモダンブラウザでサポート済み。


概略図

CORS (2).png


ちゃんとした説明

MDN読め(RTFM)


デモ

http://arunranga.com/examples/access-control/


Tips


  • CORSに限ったことではないが、Same Origin Policyは勘違いしやすいので注意


    • プロトコル、ポート番号、ドメインが全て同じならSame Origin

    • http/httpsは別プロトコル

    • foo.example.comとbar.example.comは別ドメイン



  • Access-Control-Allow-Originのワイルドカード指定は、ドメインの一部に利用することはできない。



  • クレデンシャルを含むリクエストに応答するときは、 サーバはかならずAccess-Control-Allow-Originヘッダをドメインを特定した形で返答しなければならない。 そうでない返答は、ブラウザが破棄する。


    • 「クレデンシャルを含むリクエスト」とは、Cookieを含むリクエストとか、ベーシック認証とかそういうやつ。



  • 発音は「こーす」