1. post 请求

export default function (data) {
    axios({
        method: 'post',
        url: data.url,  //后端接口地址
        responseType: 'blob',  //bolb格式的请求方式
        headers: {
            Authentication: getToken('Admin-Token')  //请求头
        },
        data: data.data //需要传给后端的请求参数体
    }).then(res => {
        const BLOB = res.data;
        const fileReader = new FileReader();  
        fileReader.readAsDataURL(BLOB);  //对请求返回的文件进行处理
        fileReader.onload = (e) => {
            let a = document.createElement('a');
            a.download = data.name + '.xlsx'
            a.href = e.target.result;
            document.body.appendChild(a)
            a.click();
            document.body.removeChild(a)
        }
    }).catch(err => {
        console.log(err.message)
    })
}

fileReader详解

2. get 请求

export default function (data) {
     axios({
         url: data.url,
         method: 'get',
         responseType: 'blob',
         params: data.data,  //与post传参方式不同之处
         headers: {
           Authentication: getToken()       
         }
     }).then(res => {
        var blob = new Blob([res.data], 
        {type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8'});
        var filename = data.name + '.xlsx';  
        var downloadElement = document.createElement('a');
        var href = window.URL.createObjectURL(blob); //创建下载的链接
        downloadElement.style.display = 'none';
        downloadElement.href = href;
        downloadElement.download =filename ; //下载后文件名
        document.body.appendChild(downloadElement);
        downloadElement.click(); //点击下载
        document.body.removeChild(downloadElement); //下载完成移除元素
        window.URL.revokeObjectURL(href); //释放掉blob对象
        }
   }

参考文章

注意：有时候导出 excel 表格，报错 “失败，网络错误” ，就是 http 请求头没加的原因，导致请求没发送成功，统一封装的axios 请求和excel导出的封装请求是相互独立的，因此需要在 excel 导出的封装请求里也加上请求头才行，有的接口没做请求头限制，因此不加请求头也能请求成功，这要看后端要求。

欢迎关注公众号：【抓住重点】，获取更多编程周边技能，与博主一起进步