[解決済み] axiosのpostリクエストでフォームデータを送信する

質問

アクシオス POST リクエストはコントローラ上のURLをヒットしますが、私のPOJOクラスにはnull値を設定します、私はクロームの開発者ツールを通過するとき、ペイロードはデータを含んでいます。私は何を間違えているのでしょうか？

AxiosのPOSTリクエストです。

var body = {
    userName: 'Fred',
    userEmail: '[email protected]'
}

axios({
    method: 'post',
    url: '/addUser',
    data: body
})
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});

ブラウザの応答。

としてヘッダーを設定すると。

headers:{
  Content-Type:'multipart/form-data'
}

リクエストはエラーを投げます。

multipart/form-data の投稿でエラーが発生しました。Content-Typeヘッダの境界がありません。

同じリクエストをpostmanで行うと、正常に動作し、私のPOJOクラスに値が設定されます。

バウンダリの設定方法と、axiosを使用してフォームデータを送信する方法について、どなたか教えてください。

どのように解決するのですか？

アクシオスのデータを投稿するには FormData() のようなものです。

var bodyFormData = new FormData();

そして、送信したいフォームにフィールドを追加してください。

bodyFormData.append('userName', 'Fred');

画像をアップロードしている場合は .append

bodyFormData.append('image', imageFile); 

そして、axiosのpostメソッドを使用します（適宜修正可能です）。

axios({
  method: "post",
  url: "myurl",
  data: bodyFormData,
  headers: { "Content-Type": "multipart/form-data" },
})
  .then(function (response) {
    //handle success
    console.log(response);
  })
  .catch(function (response) {
    //handle error
    console.log(response);
  });

関連するGitHubの課題です。

.post で 'Content-Type': 'multipart/form-data' を指定しても動作しない @ axios/axios