axios 修改http协议和转formData对象

修改协议

最近发现axios的修改协议有个很方便的操作，就是通过create创建一个axios对象的时候，就可以直接设置上传协议了。

const api = axios.create({
   headers: {
     'Content-Type': 'application/x-www-form-urlencoded',
   }
});

这样我们将协议改为了application/x-www-form-urlencoded

这个协议可以上传formData对象，但是他不能上传文件，所以如果你要上传文件，需要改为这个协议：multipart/form-data

如果默认配置无法满足，你可以使用官方提供的这种方式改写头信息

api({
  url:"xxxx",
  data:xxxx,
  headers:{
    'Content-Type': 'multipart/form-data'
  }
})

这样我们就可以覆盖默认的头信息设置了。

转formData对象

如果我们要发送一个formData对象，除了手动创建formData对象然后设置值，就是使用axios中自带的一个方法。

我百度出两种方法，第一种他虽然能转换成功，但是他会有一个多余的（empty）,所以并不完美，所以就不多说了，我这里讲一下比较完美的方案

我们需要一个拦截器，你可以设置一个针对你某个api路径的，也可以全局的，我这里设置一个全局的

import qs from "qs";

api.interceptors.request.use(config => {
  config.data = config.data ? qs.stringify(config.data) : null;  //转为formdata数据
  return config;
}, error => {
  console.log(error);
  Promise.reject(error);
});

使用该方法转换的formData十分完美，为此我们需要引入一个qs对象，这个对象，你安装了axios他就有的，qs是axios一起带来的，所以不需要单独安装。