axios+formdata 上传文件

最近项目要做文件上传，作为萌新表示这种操作有点鸭梨，知之为知之不知百度知，好吧百度说formdata 好那我们就动手了

首先照着formdata文档来先new 一个对象

let formData = new FormData()
formData.append('xxx', 'yyyyy')
跑一遍没报错，好像是可以的，但是就是console直接打印是空的，看文档说要这么干：

console.log(formData.get('xxx'))

 

由于业务需要，axios配置了拦截器，在里面做了数据处理

axios.interceptors.request.use(function (config) {
    // 在发送请求之前做了坑爹的数据处理
    return config;
  }, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
  });
这个数据把我们的数据类型变成了Object，so,浏览器给出的是application/json,

解决办法1:

就是 重新creat一个纯净的axios请求，挂载到vue原型里，然后重新请求，这个时候发现请求成功，后台也接收到文件数据，完美！！

解决办法2:

processData:false // 告诉axios不要去处理发送的数据(重要参数)

let formData = new FormData()
formData.append('file',e.target.files[0])
this.$axios({
    url:url,
    method: 'post',
    data: formData,
    processData: false,// 告诉axios不要去处理发送的数据(重要参数)
    contentType: false,   // 告诉axios不要去设置Content-Type请求头
}).then((res)=>{
    console.log(res)
})