axios的post请求,后台拿不到参数

一、axios的post请求方式

  • 第一种
axios.post( url, {
  data1: data1,
  data2: data2
}
  • 第二种
axios({
  method: 'post’,
  url: url,
  data: {
    data1: data1
    data2: data2
  }
})

具体文档参考Axios中文说明

二、导致原因

具体原因可以在请求是打印axios的request config,我们可以看到headers里面的“Content-Type”,里面显示的是application/json,如果是以这种方式传值,后台的springMVC的@RequestParam接收不到参数;网上有一些方法说在axios的配置中直接改为:axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; 然而我试过并没有用。

三、解决办法

1、后台的接收参数的注解@RequestParam改为@RequestBody
2、前端转换参数,具体步骤如下:

npm install qs --save-dev
axios.post(url, qs.stringify({
  data1: data1,
  data2: data2
})

其实qs.stringify()的目的是将键值对(key/value)的方式转为了&连接,既: data1=data1&data2=data2,有兴趣的可以打印axios的config,就可以看到request data里面的值了。

四、application/json 和 application/x-www-form-urlencoded的区别

具体释义请参照这里

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容