const baseUrl = process.env.VUE_APP_BASE_API
// 导出公用 多页面公用文件未提出 勿删
export function commonExportPost(url, data, fileName) {
// 创建axios实例
const service = axios.create({
// axios中请求配置有baseURL选项,表示请求URL公共部分
baseURL: baseUrl,
// 超时
timeout: 180000
})
service.interceptors.request.use((config) => {
config.data = securityCodeNew.interceptData(config.url, config.data)
return config
})
return service({
url: url,
method: 'post',
data: data,
responseType: 'blob',
headers: {
Authorization: localStorage.getItem('Admin-Token') ? 'Bearer ' + localStorage.getItem('Admin-Token') : ''
}
})
.then((info) => {
const data = info.data
// 有可能下载失败,比如返回{code: 0},但设置了responseType: 'blob',axios会把data强制转为blob,导致下载undefined.excel(后缀取决于文件类型,这里只是举例)
// 解决:将已转为blob类型的data转回json格式,判断是否下载成功
const reader = new FileReader()
// 如果JSON.parse(this.result)不报错,说明this.result是json字符串,则可以推测是下载报错情况下返回的对象,类似于{code: 0}
// 如果JSON.parse(this.result)报错,说明是下载成功,返回的二进制流,则进入catch进行后续处理
reader.onload = function () {
try {
const resData = JSON.parse(this.result) // this.result为FileReader获取blob数据转换为json后的数据,即后台返回的原始数据
// 如果执行到这里,说明下载报错了,进行后续处理
console.log('错误')
Message({
message: resData.msg || '失败,请联系系统管理员',
type: 'error'
})
} catch {
if ('download' in document.createElement('a')) {
//非IE下载
let url = window.URL.createObjectURL(info.data)
let link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('id', 'downloadLink')
link.setAttribute('download', fileName)
document.body.appendChild(link)
link.click()
// 删除添加的a链接
let objLink = document.getElementById('downloadLink')
document.body.removeChild(objLink)
// 释放内存
window.URL.revokeObjectURL(url)
} else {
console.log('ie下载')
//IE10+下载
window.navigator.msSaveBlob(info.data, fileName)
}
}
}
reader.readAsText(data)
})
.catch((error) => {
console.log(error)
})
}
// get方式
export function commonExportGet(fileName, url) {
return new Promise((resolve) => {
axios({
url: baseUrl + url,
method: 'GET',
headers: {
Authorization: localStorage.getItem('Admin-Token') ? 'Bearer ' + localStorage.getItem('Admin-Token') : ''
},
responseType: 'blob'
}).then((response) => {
if (!response.data) {
Message({
message: '失败,请联系系统管理员',
type: 'error'
})
return
}
const blob = new Blob([response.data])
if (window.navigator.msSaveOrOpenBlob) {
// 如果是IE浏览器
window.navigator.msSaveOrOpenBlob(blob, fileName)
} else {
// 非IE浏览器
saveAs(blob, fileName)
}
resolve()
})
})
}
Vue 下载文件 封装
于 2021-07-06 11:55:27 首次发布