后台管理项目实现下载功能(后端返回文件流)

api.bathExportEcologicalById(this.obj).then(res => {
let blob = res
const reader = new FileReader()
reader.readerAsDataURL(blob) // 转换为base64
reader.onload = e => {
// 装换完成, 创建一个a标签用于下载
let a = document.createElement(‘a’)
a.style.display = ‘none’
a.download = ‘生态修复数据数据.xls’
a.href = e.target.result
const body = document.body
document.body.appendChild(a) // 修复firefox中无法触发click
a.click()
document.body.removeChild(a)
}

修改axios配置:
api.interceptors.request.use(
config => {
// console.log(config)
if (config[0]) {
config.url += config[0]
config.data = config[0]
}
if (config.url.indexOf(“loginVerifyCode”) !== -1) {
config.headers[‘Content-Type’] = “application/x-www-form-urlencoded”
config.data = Qs.stringify(config.data)
}
if (
config.url.indexOf(’/section/export?ids’) !== -1 ||
config.url.indexOf(’/file/download/files?’) !== -1 ||
config.url.indexOf(’/waterEcologyReservoirBase/exportBatch?’) !== -1 ||
config.url.indexOf(’/WaterIntake/exportData?’) !== -1||
config.url.indexOf(’/sectionPollution/export?’) !== -1 ||
config.url.indexOf(’/CyanobacteriaBase/exportData?’) !== -1 ||
config.url.indexOf(’/CyanobacteriaRiver/exportData?’) !== -1 ||
config.url.indexOf(’/CyanobacteriaCountry/exportData?’) !== -1
) {
config.responseType = “blob”
}
if (config.url.indexOf(’/file/download/files?’) !== -1 ) {
console.log(‘config’, config)
}
// 访问携带token
const token = window.sessionStorage.getItem(‘token’)
if (token) {
config.headers.token = token;
}
// console.log(typeof(formData))
// console.log(token);
// if (token) {
// config.headers.screentoken = token;
// }
// token统一加在头部 在登陆的时候，存入token
// const token = cookie.get(“screentoken”);
// if (token) {
// config.headers.token = token;
// }
return config;
},
error => Promise.reject(error)
);