HTTPリクエストの基礎とcURL・fetch・axiosの使い分け
HTTPリクエストはWebアプリケーション開発の根幹です。APIの動作確認・デバッグ・ドキュメント化には、適切なHTTPクライアントの選択とリクエスト構造の理解が欠かせません。curl・fetch・axiosそれぞれの特徴を把握して使い分けることで、開発効率が大幅に向上します。
cURLコマンドの基本構文
curl -X POST https://api.example.com/users -H "Content-Type: application/json" -d '{"name":"Alice"}' のように、-Xでメソッド、-Hでヘッダー、-dでボディを指定します。-vオプションでリクエスト/レスポンスの全詳細を表示できます。--compressedを付けるとgzip圧縮レスポンスを自動展開します。開発環境のSSL検証を無効にするには-kオプションを使いますが本番では使用しないこと。
Fetch APIとaxiosの違い
Fetch APIはブラウザ・Node.js 18+に標準搭載されライブラリ不要ですが、エラーハンドリングに注意が必要です。HTTPエラー（4xx/5xx）ではPromiseがrejectされず、response.okで判定する必要があります。axiosはHTTPエラーを自動でrejectし、リクエスト/レスポンスインターセプター・タイムアウト設定・自動JSONシリアライズなど豊富な機能を持ちます。小規模プロジェクトにはfetch、複雑な要件にはaxiosが適しています。
HTTPメソッドの正しい使い方
GETはリソースの取得（冪等・キャッシュ可）、POSTはリソースの作成（非冪等）、PUTはリソース全体の置換（冪等）、PATCHはリソースの部分更新（冪等）、DELETEはリソースの削除（冪等）です。HEADはGETと同じだがボディなし、OPTIONSはCORSプリフライトに使用します。RESTful APIでは用途に合ったメソッドを選ぶことが重要です。
CORSとプリフライトリクエスト
ブラウザはクロスオリジンリクエスト時にCORS（Cross-Origin Resource Sharing）チェックを行います。単純リクエスト（GET・POST with application/x-www-form-urlencoded）以外はプリフライトとしてOPTIONSリクエストが送信されます。サーバーはAccess-Control-Allow-Originヘッダーで許可オリジンを返す必要があります。curlはCORSチェックを行わないため、ブラウザで失敗してもcurlでは成功するケースがあります。