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)
})