在我们使用Vue框架的时候，我们不免会遇到各种各样的问题，话不多说。我们直接扔出我们的问题

Q1：POST请求时，后端无法接受到请求参数的问题

axios.post('/user', {
  id: '2',
  username: '4'
}).then(function(response) {
  console.log(response)
}).catch(function(error) {
  console.log(error)
})

从后台取数据发现没有取到数据，我们从请求头中发现，请求头为application/json 参数的格式是Request Payload

解决方法使用 qs ;

在项目中 npm install qs 引入qs :

var qs = require('qs');
axios.post('/user', qs.stringify({
  id: '2',
  username: '4'
})).then(function(response) {
  console.log(response)
}).catch(function(error) {
  console.log(error)
})

请求头为application/x-www-form-urlencoded 参数的格式是 Form Data

qs.stringify和JSON.stringify的使用和区别

qs.stringify()将对象 序列化成URL的形式，以&进行拼接。

// 输出对比
var a = {name:'hehe',age:10};
qs.stringify(a)    // 'name=hehe&age=10'
JSON.stringify(a)  // '{"name":"hehe","age":10}'

Q2：POST请求时，请求参数出现在 url 后面的问题

这种情况明明是post请求，但是在请求的url中拼接了参数

如果出现这种问题基本上是：axios.create 使用自定义配置新建一个 axios 实例时进行post请求的时候用了params配置项。

  1. params 会将请求的参数拼接到url中去，用于get请求
  2. data 是添加到请求体(body)里面去，用于post请求
export function autoImport(data) {
  return request({
    url: '/Fjtk/autoImport',
    method: 'post',
    data			// data 不会直接拼接到url
  })
}

export function getfjTaskList(params) {
  return request({
    url: '/Fjtk/getfjTaskList',
    method: 'get',
    params			// params 会直接拼接到url
  })
}

由于时间仓促，错误与疏忽之处在所难免，希望各位朋友们以邮件的形式反馈问题给我，再次表示感谢！