CORS チェッカー
API があなたのオリジンからのリクエストを受け入れるか確認。プリフライト OPTIONS と実リクエストを送信し、全 Access-Control-* ヘッダを表示します。
CORS とは?
CORS (Cross-Origin Resource Sharing) はブラウザのセキュリティ機構です。デフォルトでは https://a.com のスクリプトは https://b.com のレスポンスを読めません。b.com のサーバーが Access-Control-Allow-Origin ヘッダを送って明示的に許可する必要があります。非単純リクエスト (JSON POST、独自ヘッダ等) ではブラウザがまず OPTIONS プリフライトを送って権限確認 — サーバーレスポンスがオリジン・メソッド・ヘッダを許可しなければ実リクエストは遮断され、DevTools に CORS エラーが表示されます。
CORS レスポンスヘッダ解説
Access-Control-Allow-Origin許可するオリジンを指定。特定のオリジン、"*" (任意)、または要求オリジンのエコー。
Access-Control-Allow-Credentials"true" ならブラウザは Cookie / 認証ヘッダを送信。Allow-Origin: * と併用不可。
Access-Control-Allow-Methodsサーバーが許可する HTTP メソッド。プリフライト応答でのみ有効。
Access-Control-Allow-Headersサーバーが許可するリクエストヘッダ。Authorization や独自 X-* 等の非単純ヘッダで有効。
Access-Control-Expose-Headersブラウザが JavaScript に公開するレスポンスヘッダ。デフォルトは短いセーフリストのみ。
Access-Control-Max-Ageブラウザがプリフライト結果をキャッシュする秒数。大きい値で OPTIONS の繰り返しを回避。
CORS チェッカー FAQ
ブラウザでは CORS エラーが出るのに、このツールではヘッダが見えるのはなぜ?
CORS を強制するのはブラウザで、サーバーではありません。本ツールは当社バックエンドで動くため CORS 規則は適用されず、生レスポンスが見えます。ブラウザは Access-Control-* ヘッダに基づいてクライアント側で遮断します。ここのヘッダがオリジン/メソッド/ヘッダと合わなければ、サーバーが応答していてもブラウザは遮断します。
プリフライト OPTIONS リクエストとは?
非単純なクロスオリジンリクエスト (基本ヘッダ付きの単純 GET/HEAD/POST 以外) では、ブラウザがまず OPTIONS を送って「このリクエストを送ってよいか?」と確認。サーバーは Access-Control-Allow-Methods、Allow-Headers、Allow-Origin で回答。実リクエストが許可されればブラウザは続行、そうでなければ遮断します。
なぜ Access-Control-Allow-Origin: * だけでは不十分なのですか?
リクエストに Credentials (Cookie、Authorization ヘッダ、TLS クライアント証明書) が含まれる場合、ブラウザは "*" を拒否し具体的なオリジンを要求します。サーバーは Access-Control-Allow-Origin にオリジンを正確に返し Access-Control-Allow-Credentials: true を設定する必要があります。
CORS はサーバー間リクエストにも適用?
いいえ。CORS はブラウザのみのセキュリティ機能です。curl、サーバーの Node fetch、Postman、その他非ブラウザクライアントは CORS を完全に無視します。非ブラウザ環境で "CORS エラー" と見える場合、原因は別のところ (ネットワーク、認証、URL 誤り) にあります。
CORS エラーを修正するには?
サーバー側で直し、クライアント側で回避しないこと。正しい Access-Control-Allow-Origin (フロントエンドのオリジン)、Allow-Methods (使用する GET/POST 等)、Allow-Headers (独自/認証ヘッダ) を設定。Credentials を使うなら Allow-Credentials: true。OPTIONS を処理し 2xx を返すこと。CORS を無効化するブラウザ拡張は開発の近道であり、本番で依存してはいけません。