BLOGTIMES
2021/11/26

curl で CORS の設定を確認する

  ajax  javascript 
このエントリーをはてなブックマークに追加

慣れないとちょっと難しいウェブサーバの CORS ヘッダの設定

原理と設定方法については「オリジン間リソース共有 (CORS) - HTTP | MDN」を一通り読めば大丈夫ですが、XMLHttpRequest などを使って実際のリクエストをしてみると上手く動かないということが多々あります。そんなときには curl でプリフライトリクエストを模したリクエストを送ってみると原因を確かめやすいです。

オリジンの https://example.com から https://example.jp/hoge にリクエストを送信する場合、curl のコマンドでは以下のように表すことができます。

curl -H "Origin: https://example.com" -H "Access-Control-Request-Method: GET" -H "Access-Control-Request-Headers: Content-Type, Authorization, X-Requested-With" -X OPTIONS -v "https://example.jp/hoge"

上記のコマンドを実行すると以下のような結果を得ることができます*1

> OPTIONS /hoge HTTP/1.1 > Host: example.jp > User-Agent: curl/7.55.1 > Accept: */* > Origin: https://example.com > Access-Control-Request-Method: GET > Access-Control-Request-Headers: Content-Type, Authorization, X-Requested-With < HTTP/1.1 200 OK < Date: Fri, 26 Nov 2021 3:36:09 GMT < Server: Apache/2.4 < Access-Control-Allow-Origin: https://example.com < Access-Control-Allow-Methods: GET < Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With < Access-Control-Max-Age: 5 < Access-Control-Allow-Credentials: true < Content-Length: 0 < Content-Type: text/html

上記でリクエスト>とレスポンス<で、同じ内容が帰ってきていれば問題ありません、
例えば Origin:Access-Control-Allow-Origin:Access-Control-Request-Method:Access-Control-Allow-Methods:Access-Control-Request-Headers:Access-Control-Allow-Headers: の部分の対応をチェックすることになります。

  • *1: schannelのログは除いています。

トラックバックについて
Trackback URL:
お気軽にどうぞ。トラックバック前にポリシーをお読みください。[policy]
このエントリへのTrackbackにはこのURLが必要です→https://blog.cles.jp/item/12880
Trackbacks
このエントリにトラックバックはありません
Comments
愛のあるツッコミをお気軽にどうぞ。[policy]
古いエントリについてはコメント制御しているため、即時に反映されないことがあります。
コメントはありません
Comments Form

OpenID を使ってログインすることができます。

Identity URL: Yahoo! JAPAN IDでログイン