解決axios發(fā)送post請(qǐng)求返回400狀態(tài)碼的問(wèn)題
更新時(shí)間：2018年08月11日 15:38:32 作者：transformer_WSZ
今天小編就為大家分享一篇解決axios發(fā)送post請(qǐng)求返回400狀態(tài)碼的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
今天在用 axios 發(fā)送一個(gè)跨域的post請(qǐng)求時(shí)，遇到了一個(gè)坑：Uncaught (in promise) Error: Request failed with status code 400。
前臺(tái)代碼如下：
axios({
method: "post",
url: "http://localhost:8080/employee/testpost",
data: {
username: '234234',
password: '4565'
}
}).then((res) => {
console.log(res.data);
})
后臺(tái)代碼如下：
@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;
}
而當(dāng)我在postman上發(fā)送post請(qǐng)求時(shí)就能成功獲得返回?cái)?shù)據(jù)。困擾了很久，才發(fā)現(xiàn)是請(qǐng)求頭的問(wèn)題。axios請(qǐng)求頭的 Content-Type 默認(rèn)是 application/json，而postman默認(rèn)的是 application/x-www-form-urlencoded。我這里采取的解決辦法是改變后臺(tái)的接收方式：
@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;
}
這樣數(shù)據(jù)就成功返回了！
以上這篇解決axios發(fā)送post請(qǐng)求返回400狀態(tài)碼的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue實(shí)現(xiàn)倒計(jì)時(shí)功能
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)倒計(jì)時(shí)功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-03-03
這篇文章主要介紹了在 Vue.js中優(yōu)雅地使用全局事件的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-02-02
這篇文章主要介紹了Vue中this.$emit和this.$on的使用方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
Vue?ElementUI?table實(shí)現(xiàn)雙擊修改編輯某個(gè)內(nèi)容的方法
在實(shí)現(xiàn)表格單元格雙擊編輯功能時(shí),需使用@cell-dblclick事件來(lái)觸發(fā)雙擊操作,將單元格切換為input輸入框,通過(guò)ref引用和綁定失焦及回車事件來(lái)確認(rèn)編輯,同時(shí),需要處理編輯數(shù)據(jù)的更新和方法邏輯的完善2024-09-09
這篇文章主要介紹了vue屬性props默認(rèn)類型的寫(xiě)法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了vue如何在表格中實(shí)現(xiàn)右鍵菜單問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-04-04
在看這篇文章的幾點(diǎn)要求：需要你先知道Vue-Router是個(gè)什么東西，用來(lái)解決什么問(wèn)題，以及它的基本使用。如果你還不懂的話，建議上官網(wǎng)了解下Vue-Router的基本使用后再回來(lái)看這篇文章2022-09-09
這篇文章主要介紹了Vue Element-ui 鍵盤事件失效的解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
Vue.set()動(dòng)態(tài)的新增與修改數(shù)據(jù),觸發(fā)視圖更新的方法
今天小編就為大家分享一篇Vue.set()動(dòng)態(tài)的新增與修改數(shù)據(jù),觸發(fā)視圖更新的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
這篇文章主要介紹了基于ant design日期控件使用_僅月份的操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-10-10