解决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 相关文章推荐
js给dropdownlist添加选项的小例子
Mar 04 Javascript
js弹出层(jQuery插件形式附带reLoad功能)
Apr 12 Javascript
js showModalDialog弹出窗口实例详解
Jan 07 Javascript
JavaScript实现的in_array函数
Aug 27 Javascript
javascript实现树形菜单的方法
Jul 17 Javascript
原生js实现图片轮播特效
Dec 18 Javascript
js无提示关闭浏览器窗口的两种方法分析
Nov 06 Javascript
angularjs实现时间轴效果的示例代码
Nov 29 Javascript
微信小程序时间轴实现方法示例
Jan 14 Javascript
React 使用Hooks简化受控组件的状态绑定
Mar 18 Javascript
详解Vue 全局变量,局部变量
Apr 17 Javascript
浅谈vue.watch的触发条件是什么
Nov 07 Javascript
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
德生PL550的电路分析
2021/03/02 无线电
PHP网上调查系统
2006/10/09 PHP
php文件操作实例代码
2012/05/10 PHP
php权重计算方法代码分享
2014/01/09 PHP
php单链表实现代码分享
2016/07/04 PHP
解决PHP上传非标准格式的图片pjpeg失败的方法
2017/03/12 PHP
JavaScript具有类似Lambda表达式编程能力的代码(改进版)
2010/09/14 Javascript
jQuery的链式调用浅析
2010/12/03 Javascript
鼠标左键单击冲突的问题解决方法(防止冒泡)
2014/05/14 Javascript
Jquery动态添加及删除页面节点元素示例代码
2014/06/16 Javascript
javascript中cookie对象用法实例分析
2015/01/30 Javascript
JS实现网页表格自动变大缩小的方法
2015/03/09 Javascript
浅谈Node.js:fs文件系统模块
2016/12/08 Javascript
原生的强大DOM选择器querySelector介绍
2016/12/21 Javascript
Bootstrap源码学习笔记之bootstrap进度条
2016/12/24 Javascript
小发现之浅谈location.search与location.hash的问题
2017/06/23 Javascript
Vue利用路由钩子token过期后跳转到登录页的实例
2017/10/26 Javascript
webpack本地开发环境无法用IP访问的解决方法
2018/03/20 Javascript
详解vue组件开发脚手架
2018/06/15 Javascript
详解三种方式解决vue中v-html元素中标签样式
2018/11/22 Javascript
Node爬取大批量文件的方法示例
2019/06/28 Javascript
Vue使用自定义指令实现拖拽行为实例分析
2020/06/06 Javascript
基于JS实现快速读取TXT文件
2020/08/25 Javascript
Python中用post、get方式提交数据的方法示例
2017/09/22 Python
python数据结构之列表和元组的详解
2017/09/23 Python
Python中的groupby分组功能的实例代码
2018/07/11 Python
基于python实现名片管理系统
2018/11/30 Python
解决Python3用PIL的ImageFont输出中文乱码的问题
2019/08/22 Python
Python虚拟环境venv用法详解
2020/05/25 Python
Bath & Body Works阿联酋:在线购买沐浴和身体用品
2021/02/27 全球购物
Linux文件操作命令都有哪些
2015/02/27 面试题
建筑文秘专业个人求职信范文
2013/12/28 职场文书
基于Nginx实现限制某IP短时间访问次数
2021/03/31 Servers
mysql 数据插入优化方法之concurrent_insert
2021/07/01 MySQL
Python使用PyYAML库读写yaml文件的方法
2022/04/06 Python
2022年显卡天梯图(6月更新)
2022/06/17 数码科技