utils.js文件

import axios from 'axios'
// 导出Excel公用方法
export function exportMethod(data) {
    axios({
        method: data.method,
        url: `${data.url}${data.params ? '?' + data.params : ''}`,
        responseType: 'blob'
    }).then((res) => {
        const link = document.createElement('a')
        console.log(res.data)
        let blob = new Blob([res.data], {type: 'application/vnd.ms-excel'})
        console.log(blob)
        link.style.display = 'none'
        link.href = URL.createObjectURL(blob)
 
        // link.download = res.headers['content-disposition'] //下载后文件名
        link.download = data.fileName //下载的文件名
        document.body.appendChild(link)
        link.click()
        document.body.removeChild(link)
    }).catch(error => {
        this.$Notice.error({
            title: '错误',
            desc: '网络连接错误'
        })
        console.log(error)
    })
}
 
.vue组件代码
import { exportMethod } from '@/assets/utils'
    exportTable () { 
      // 导出
    let myObj = {
      method: 'get',
      url: '/api/management/statistics/eColumn',
      fileName: '栏目汇总表',
      // params: `startDate=${changeDate(this.dateValue[0])}&endDate=${changeDate(this.dateValue[1])}`
    }
    exportMethod(myObj)
    }
  },
 
原生异步方法接受文件流(下载):
function downLoadByUrl(url){
var xhr = new XMLHttpRequest();
//GET请求,请求路径url,async(是否异步)
xhr.open('GET', url, true);
//设置请求头参数的方式,如果没有可忽略此行代码
xhr.setRequestHeader("token", cookieToken);
xhr.setRequestHeader("userId", userId);
//设置响应类型为 blob
xhr.responseType = 'blob';
//关键部分
xhr.onload = function (e) {
//如果请求执行成功
if (this.status == 200) {
let blob = this.response;
let filename = "XX信息-"+new Date()+".xlsx";//如123.xls
let a = document.createElement('a');
blob.type = "application/octet-stream";
//创键临时url对象
let url = URL.createObjectURL(blob);
a.href = url;
a.download=filename;
a.click();
//释放之前创建的URL对象
window.URL.revokeObjectURL(url);
}
};
//发送请求
xhr.send();
}
注意:
后端返回的stream流,可以采用原生和axios获取成功。jquery.ajax不能接受,$.ajax是基于HTTP的,而HTTP是一个设计来传输完整数据的协议,而不是用来处理连续的数据流。