axios送信post要求が400状態コードに戻る問題を解決します。

今日はaxiosでドメインをまたぐポスト要求を送る時に、アンカグートError：Request failed with status code 400に出会いました。
フロントコードは以下の通りです。

axios({
 method: "post",
 url: "http://localhost:8080/employee/testpost",
 data: {
  username: '234234',
  password: '4565'
 }
}).then((res) => {
 console.log(res.data);
})

バックグラウンドコードは以下の通りです。

@CrossOrigin
@PostMapping("/employee/testpost")
@ResponseBody
public Result testpost(@RequestParam(value = "username", required = true) String username,
     @RequestParam(value = "password", required = true) String password) {
 System.out.println(username + " , " + password);
 Result json = new Result();
 json.setResult(1);
 return json;
}

postmanでpostリクエストを送信するとリターンデータが得られます。長い間悩んでいましたが、頭をお願いする問題だと気づきました。axiosリクエストヘッドのContentt-Typeはデフォルトではaplication/jsonですが、postmanはデフォルトではaplication/x-wn-urlencodedです。ここで取った解決策はバックグラウンドの受信方式を変えることです。

@CrossOrigin
@PostMapping("/employee/testpost")
@ResponseBody
public Result testget(@RequestBody Map map) {
 System.out.println(map.get("username") + " , " + map.get("password"));
 Result json = new Result();
 json.setResult(1);
 return json;
}

これでデータが戻りました。
以上の問題は、axiosがpostを送って400状態コードを返すということです。つまり、小編集が皆さんに提供している内容を全部共有しています。参考にしていただければと思います。よろしくお願いします。