axios踩坑!!!

2,213 阅读1分钟

在做项目的过程中,只要是post请求就拿不到后台数据,应该说是前端连请求都发送不出去,后台也没有我的访问记录,但是get请求就可以拿到数据。在我不断地测试之下我敢肯定就是get和post的请求方式的区别了。于是查阅资料发现axios的post请求方式比较特殊,需要qs来对数据进行序列化。。。因为HTTP请求中的get请求和post请求参数的存放位置是不一样的,get请求的参数以键值对的方式跟在url后面的,而post请求的参数是以键值对的方式在请求体里的,axios默认发送数据时,数据格式是Request Payload,并非我们常用的Form Data格式,所以参数必须要以键值对形式传递,不能以json形式传参。 其实我们只要做两步设置就可以解决了

  1. 用Qs.stringify()就是把传入的对象转换为键值对的形式,Qs是axios里面自带的,所以直接引入就可以了
  2. 设置请求头里的'Content-Type'为'application/x-www-form-urlencoded'

post方式

import axios from '../utils/myaxios'
import qs from 'qs'

export const login = (data) => {
  // return axios.post('/user/login.do', qs.stringify(data))
  return axios({
    method: 'post',
    url: '/user/login.do',
    data: qs.stringify(data)
  })
}

get方式

export const searchPages = (url, params) => {
  return axios({
    method: 'get',
    url: '/pay/fastconfig/queryFastChannelPages.do',
    params: {
      version: '1.0'
    }
  })
}