← 記事

HTTP FIELD GUIDE

CORS とブラウザーの HTTP リクエスト

cURL では成功する要求が Web ページでは失敗する理由を理解します。

ブラウザーが止める理由

Web ページには同一オリジンポリシーが適用されます。別オリジンへの fetch を許可するには、対象サーバーが CORS 応答ヘッダーを返す必要があります。方法やヘッダーによっては先に OPTIONS プリフライトが送られ、そこで失敗すると本来の要求は送られません。

cURL との違い

cURL はブラウザーの CORS 制限を受けません。端末で成功しても、その機器から接続できることを示すだけで、Web ページが応答を読める証拠にはなりません。ブラウザーは Host や Cookie も制御し、HTTPS ページから安全でない HTTP への接続を止める場合があります。

調べ方

開発者ツールの Network でプリフライト、Origin、応答ヘッダーを調べます。Access-Control-Allow-Origin と許可された方法やヘッダーが要求に合うか確認します。no-cors は解決策ではありません。応答が不透明になり、状態や本文を読めなくなります。API が CORS を許可できない場合は、信頼できるローカルクライアントか保護された中継を使います。

参考資料