ホームページ >ウェブフロントエンド >jsチュートリアル >Axios のサービスにデータを渡し、正しいコンテンツ タイプと境界が設定されていることを確認するにはどうすればよいですか?
Axios のサービスにデータを渡す
問題: のヘッダーに「_boundary」を付加したいと考えています。 Axios API 呼び出しですが、Axios サービスでデータにアクセスできません。
解決策: Axios は、FormData などの特定のリクエスト本文形式のコンテンツ タイプを自動的に処理します。 FormData インスタンスをデータ引数として渡すと、手動構成なしで適切な Content-Type と MIME 境界が設定されます。
詳細な説明:
自動コンテンツ タイプ処理:
FormData インスタンスを送信するとき、ランタイムは自動的に Content-Type を「multipart/form-data」に設定し、正しい MIME 境界トークンを含めます。この動作により、データが正しくシリアル化されてサーバーに送信されることが保証されます。
例:
Axios で FormData インスタンスを送信する例を次に示します:
<code class="javascript">const form = new FormData(); // Attach files and other fields to the formData instance form.append('file', fileInput.files[0]); form.append('foo', 'foo'); axios.post(url, form);</code>
カスタム コンテンツ タイプの処理:
文字列データを特定の形式 (例: text/xml、 application/json).
例:
<code class="javascript">const data = JSON.stringify({ foo: 'foo', bar: 'bar' }); axios.post(url, data, { headers: { 'content-type': 'application/json' }, });</code>
Axios v0.27.1 および v1.0.0 の回避:
これらの Axios バージョンには、FormData の処理に関する既知の問題があります。 Fetch API、got (Node.js の場合)、ky (ブラウザーの場合) などの代替手段を使用することをお勧めします。
Node.js の考慮事項:
Node.js バックエンドで Axios を使用すると、FormData インスタンスから Content-Type ヘッダーが推論されません。これに対処するには、リクエスト インターセプターを使用するか、ヘッダーを手動でマージします。
jQuery $.ajax() メソッド:
デフォルトでは、$.ajax()ペイロードを「application/x-www-form-urlencoded」として送信し、jQuery.param() を使用して JavaScript データをシリアル化します。ブラウザが Content-Type を自動的に設定できるようにするには、次のオプションを使用します:
<code class="javascript">$.ajax({ url, method: 'POST', data: body, contentType: false, // Let the browser figure out the content type processData: false, // Don't attempt to serialize data });</code>
以上がAxios のサービスにデータを渡し、正しいコンテンツ タイプと境界が設定されていることを確認するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。