Web技術の基礎
https://app.example.com のページのJavaScriptが、fetch を使って https://api.example.net/orders へ、Content-Type: application/json の本文を付けたPOSTのリクエストを送ろうとしている。このときのCORSの動作として、正しいものはどれか。
- ACORSはブラウザ以外にも働くので、サーバの許可がなければ、コマンドラインのツールから送ったPOSTもネットワークの途中で止められる
- BブラウザはまずOPTIONSメソッドで事前の確認(プリフライト)を送り、サーバがヘッダで許可を返した場合だけ、本来のPOSTを送る
- C異なるオリジンへのリクエストはいつも確認なしで送られ、サーバが応答に何も付けなくても、ページのJavaScriptは応答を読み取れる
答えと解説を見る
正解：B. ブラウザはまずOPTIONSメソッドで事前の確認(プリフライト)を送り、サーバがヘッダで許可を返した場合だけ、本来のPOSTを送る
CORSは、同一オリジンポリシーで制限されている、ほかのオリジンへのリクエストとその応答の読み取りを、サーバが許可した範囲で認める仕組みです。Content-Type が application/json のPOSTは、単純なフォームの送信では作れない種類のリクエストなので、ブラウザはまず OPTIONS で、使うメソッドやヘッダを伝えて許可を確かめます。サーバの応答に Access-Control-Allow-Origin などの許可がなければ、ブラウザは本来のリクエストを送りません。CORSはブラウザが守る規則なので、サーバは別に、認証や権限の確認で自分を守る必要があります。
- A. CORSはブラウザが行う確認で、ブラウザ以外のツールからのリクエストは止めません。サーバ側の認証や権限の確認が別に必要です。
- B. 正しい。application/json の本文を付けたPOSTでは、プリフライトで許可を確かめてから送ります。
- C. ほかのオリジンの応答をスクリプトが読めるのは、サーバが Access-Control-Allow-Origin などで許可した場合だけです。