CORS を前提としたコードを書くときのポイント
- AngularJS では $http のヘッダーに ‘Content-Type’: ‘application/x-www-form-urlencoded’ を追加する。しかし、Basic 認証をはじめ、カスタムヘッダーを追加する場合、この Content-Type 追加は意味が無い。
- サーバでは、プリフライトリクエストがあった場合に対応する次のヘッダーをレスポンスに含めるようにする。
- Access-Control-Allow-Origin:* ← 許可する接続元(* はどこからでも受け入れる)
- Access-Control-Allow-Methods ← 許可するメソッド(POST など)
- Access-Control-Allow-Headers ← 許可するヘッダー(authorization や独自のカスタムヘッダーなど)
CORS = HTTP access control = クロスサイト HTTP アクセス制限、とは?
- ブラウザは、アクセスしたページ以外のドメインから何かを取ってくることを制限している。基本的にはできないようになっている。
- そのため、たとえば次のようなことができない。ローカルホスト上のウェブサーバに AngularJS のサンプルを置いたとする。ページのボタンを押したら、とあるサイトからデータを取ってきて表示する。
- ローカルホストドメインと、とあるサイトのドメインは異なる。ウェブブラウザでローカルホストのページを表示している。そのため、別ドメインであるとあるサイトのデータへのアクセスは制限される。
- これは、セキュリティ上の観点から施された、ブラウザの仕様