解決axios發(fā)送post請求返回400狀態(tài)碼的問題
更新時間：2018年08月11日 15:38:32 作者：transformer_WSZ
今天小編就為大家分享一篇解決axios發(fā)送post請求返回400狀態(tài)碼的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
今天在用 axios 發(fā)送一個跨域的post請求時，遇到了一個坑：Uncaught (in promise) 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上發(fā)送post請求時就能成功獲得返回數(shù)據(jù)。困擾了很久，才發(fā)現(xiàn)是請求頭的問題。axios請求頭的 Content-Type 默認是 application/json，而postman默認的是 application/x-www-form-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;
}
這樣數(shù)據(jù)就成功返回了！
以上這篇解決axios發(fā)送post請求返回400狀態(tài)碼的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue3+element-plus?Dialog對話框的使用與setup?寫法的用法
這篇文章主要介紹了vue3+element-plus?Dialog對話框的使用?與?setup?寫法的使用,本文通過兩種方式結(jié)合實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-04-04
這篇文章主要介紹了vue中使用帶隱藏文本信息的圖片、圖片水印的方法，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-04-04
這篇文章主要介紹了Vue組件公用方法提取mixin實現(xiàn)，多個組件共用一個方法時可以用?mixin?抽取到一個js文件中，作為共用方法，下面一起進入文章了解更多詳細內(nèi)容吧2022-03-03
vue2.0實現(xiàn)倒計時的插件(時間戳 刷新 跳轉(zhuǎn) 都不影響)
我發(fā)現(xiàn)好多倒計時的插件，刷新都會變成從頭再來，于是自己用vue2.0寫了一個，感覺還不錯，特此分享到腳本之家平臺供大家參考下2017-03-03
這篇文章主要為大家詳細介紹了Vue3響應(yīng)式核心之reactive的相關(guān)知識，文中的示例代碼講解詳細，對我們學習Vue3有一定的幫助，需要的可以參考一下2023-04-04
Vue+ElementUi實現(xiàn)點擊表格鏈接頁面跳轉(zhuǎn)和路由效果
這篇文章主要介紹了Vue+ElementUi實現(xiàn)點擊表格中鏈接進行頁面跳轉(zhuǎn)和路由,本文結(jié)合實例代碼給大家介紹的非常詳細,感興趣的朋友跟隨小編一起看看吧2024-03-03
Vue.js 是一種流行的 JavaScript 框架,它提供了一種簡單且高效的方式來構(gòu)建用戶界面,在 Vue 中,父子組件之間的雙向綁定是一種常見的需求,下面我們就來學習一下vue中父子組件雙向綁定的常用方法吧2023-10-10
vue-element-admin項目導入和導出的實現(xiàn)
組件是Vue.js最強大的功能，這篇文章主要介紹了vue-element-admin項目導入和導出的實現(xiàn)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-05-05
這篇文章主要介紹了VUE項目中SASS的使用及說明，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-06-06
這篇文章主要介紹了vue引入靜態(tài)js文件的方法,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-06-06