vue中使用axios进行下载

axios下载文件

api.js中的方法

// 配置文件导出
export function exportProject(projectID) {
  return request({
    url: '/config/project/export',
    method: 'get',
    responseType: 'blob',
    params: {
      projectID: projectID
    }
  })
}

如果配置了axios拦截,则需要对二进制文件放行

service.interceptors.response.use(
  response => {
    if (response.request.responseType === 'blob') {
      return response
    }
    // do something...
    }

vue文件中

exportProject(this.projectID).then((res) => {
     const blob = res.data;
     const reader = new FileReader();
     reader.readAsDataURL(blob);
     reader.onload = (e) => {
       //模拟a标签点击
       const a = document.createElement('a');
       // // 后端设置的文件名称在res.headers的 "content-disposition": "form-data; name=\"attachment\"; filename=\"name.zip\""
       a.download = this.projectID + '.zip';
       a.href = e.target.result;
       document.body.appendChild(a);
     a.click();
     document.body.removeChild(a);
   };
 }).finally(() => {
   this.loading = false
 })