取得する cURL: リクエストを端末からブラウザに移動する

フラグのマッピング方法

• `-X POST` → `method: "POST"` (または `-d` から方法を推測)。
• `-H "Content-Type: application/json"` → `headers` のエントリ。
• `-d '{"a":1}'` → `body: JSON.stringify(...)`;特に指定しない限り、cURL はフォームエンコードして送信します。
• `--data-binary @file` → 文字列ではなく、`Blob`、`FormData`、または `ArrayBuffer` の本体。
• `-u user:pass` → `user:pass` の Base64 から構築された `Authorization: Basic …` ヘッダー。
• `-F name=@file` → `FormData` と `File`。これは、ファイルのアップロードを表す方法です。

                await fetch('https://api.example.com/v1/orders', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    Authorization: 'Bearer ' + token,
  },
  body: JSON.stringify({ sku: 'YB-1', qty: 2 }),
});
              

CORS: cURL が考慮する必要がなかった部分

cURL はブラウザのセキュリティ モデルの外側で実行されるため、応答するホストを呼び出すことができます。ページ内の `fetch` は CORS によってバインドされます。サーバーはオリジンを許可する必要があり、単純なリクエストを超えるものについては、プリフライト `OPTIONS` にも正しく応答する必要があります。端末では完全に機能する変換されたコマンドが、ブラウザではまさにこの理由により、不透明なネットワーク エラーで失敗する可能性があります。許可はサーバーから取得する必要があるため、リクエストのヘッダーをいくら編集しても問題は解決されません。

CORS メッセージでフェッチが失敗した場合、修正は JavaScript ではなく、API またはプロキシ上で行われます。問題を「回避」するためにクライアント コードに API キーを追加して回避することは絶対に行わないでください。

認証情報、リダイレクト、ストリーミング

さらに 2 つの動作が端末とは異なります。 `credentials: "include"` を渡さない限り Cookie は送信されず、サーバーはワイルドカードではなく明示的な送信元を使用して応答する必要があります。リダイレクトの後にはデフォルトで `redirect: "follow"` が続きますが、サーバーが処理しない限り、リダイレクトではオリジン全体で `Authorization` ヘッダーが失われます。そのため、認証された呼び出しでは多くの場合 `redirect: "manual"` と意図的なフォローが必要になります。ストリーミング応答は `response.body` から `ReadableStream` として読み取られ、cURL は受信したときに単純に出力します。

フェッチかアクシオスか？

`fetch` は組み込まれており、最新のどこでも機能します。 axios は、自動 JSON 解析、インターセプタ、非 2xx 応答の読み取り可能なエラー、古いランタイムでのアップロードの進行状況など、利便性を追加します。変換された cURL コマンドは、生成されたオプションを axios 呼び出しに貼り付け、ヘッダーと本文が変更されずに引き継がれるため、信頼できる開始点になります。

漏れなく変換

実際のセッションからコピーされた cURL コマンドには、通常、ライブベアラートークン、API キー、またはセッション Cookie が含まれます。ブラウザーで実行される変換では、これらの資格情報がマシン上に保持されます。これが、自分で入力したものではないリクエストを処理する唯一の賢明な方法です。