解决axios发送post请求返回400状态码的问题


Posted in Javascript onAugust 11, 2018

今天在用 axios 发送一个跨域的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上发送post请求时就能成功获得返回数据。困扰了很久,才发现是请求头的问题。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;
}

这样数据就成功返回了!

以上这篇解决axios发送post请求返回400状态码的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 动态加载 css 方法总结
Jul 11 Javascript
Jquery作者John Resig自己封装的javascript 常用函数
Nov 09 Javascript
jQuery动态显示和隐藏datagrid中的某一列的方法
Dec 11 Javascript
jQuery链式操作实例分析
Nov 16 Javascript
jQuery对象与DOM对象转换方法详解
May 10 Javascript
jQuery获取访问者IP地址的方法(基于新浪API与QQ查询接口)
May 25 Javascript
ES6新特性四:变量的解构赋值实例
Apr 21 Javascript
原生JS 购物车及购物页面的cookie使用方法
Aug 21 Javascript
微信小程序实现下拉刷新和轮播图效果
Nov 21 Javascript
浅谈Angular 中何时取消订阅
Nov 22 Javascript
webpack+react+antd脚手架优化的方法
Apr 02 Javascript
vue使用exif获取图片旋转,压缩的示例代码
Dec 11 Vue.js
vue 组件的封装之基于axios的ajax请求方法
Aug 11 #Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
Aug 11 #Javascript
vuejs前后端数据交互之从后端请求数据的实例
Aug 11 #Javascript
解决vue中post方式提交数据后台无法接收的问题
Aug 11 #Javascript
vue.js配合$.post从后台获取数据简单demo分享
Aug 11 #Javascript
jQuery的Ajax接收java返回数据方法
Aug 11 #jQuery
bootstrap模态框弹出和隐藏,动态改变中间内容的实例
Aug 10 #Javascript
You might like
用ADODB来让PHP操作ACCESS数据库的方法
2006/12/31 PHP
php常用ODBC函数集(详细)
2013/06/24 PHP
php从数组中随机选择若干不重复元素的方法
2015/03/14 PHP
PHP回溯法解决0-1背包问题实例分析
2015/03/23 PHP
PHP+MYSQL中文乱码问题
2015/07/01 PHP
php+ajax无刷新分页实例详解
2015/12/07 PHP
php设计模式之组合模式实例详解【星际争霸游戏案例】
2020/03/27 PHP
html+js实现动态显示本地时间
2013/09/21 Javascript
禁止页面刷新让F5快捷键及右键都无效
2014/01/22 Javascript
js读取json的两种常用方法示例介绍
2014/10/19 Javascript
jquery遍历json对象集合详解
2016/05/18 Javascript
javascript循环链表之约瑟夫环的实现方法
2017/01/16 Javascript
JavaScript的事件机制详解
2017/01/17 Javascript
JavaScript常用正则函数用法示例
2017/01/23 Javascript
nodejs中模块定义实例详解
2017/03/18 NodeJs
js编写选项卡效果
2017/05/23 Javascript
bootstrap modal+gridview实现弹出框效果
2017/08/15 Javascript
微信小程序表单验证功能完整实例
2017/12/01 Javascript
layui 弹出删除确认界面的实例
2019/09/06 Javascript
微信小程序实现上拉加载功能示例【加载更多数据/触底加载/点击加载更多数据】
2020/05/29 Javascript
使用原生JS实现滚轮翻页效果的示例代码
2020/05/31 Javascript
[01:38]DOTA2辉夜杯 欢乐的观众现场采访
2015/12/26 DOTA
[58:58]2018DOTA2亚洲邀请赛 4.4 淘汰赛 TNC vs VG 第二场
2018/04/05 DOTA
简单介绍Python中的try和finally和with方法
2015/05/05 Python
浅谈Python编程中3个常用的数据结构和算法
2019/04/30 Python
pytorch下使用LSTM神经网络写诗实例
2020/01/14 Python
python数据库编程 ODBC方式实现通讯录
2020/03/27 Python
Python发送邮件封装实现过程详解
2020/05/09 Python
HTML5中实现拖放效果无须借助javascript
2012/12/26 HTML / CSS
英国航空官网:British Airways
2016/09/11 全球购物
英国排名第一的在线宠物用品商店:Monster Pet Supplies
2018/05/20 全球购物
澳大利亚家具商店:Freedom
2020/12/17 全球购物
Solaris操作系统的线程机制
2012/12/23 面试题
村党的群众路线教育实践活动工作总结
2014/10/25 职场文书
2015年端午节活动总结
2015/02/11 职场文书
一文带你理解vue创建一个后台管理系统流程(Vue+Element)
2021/05/18 Vue.js