获取文件接口
/**
* 获取文件接口
*/
exportScore(id).then((response) => {
const resData = response.data
console.log(resData.type)
const fileReader = new FileReader()
fileReader.onload = function() {
try {
const jsonData = JSON.parse(fileReader.result) // 后台返回的信息对象
Message({ message: jsonData.msg, type: 'error' })
} catch (err) { // 解析成对象失败，说明是正常的文件流
downloadBlob(response, 'xlsx')
}
}
fileReader.readAsText(resData)
})
下载文件流
/**
* 下载文件流
*/
/**
* 解析blob响应内容并下载
* @param res blob响应内容
* @param mimeType MIME类型
*/
export function downloadBlob(res, mimeType) {
console.log(mimeType)
const mimeMap = {
xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
}
const aLink = document.createElement('a')
const blob = new Blob([res.data], { type: mimeMap[mimeType] })
// 从response的headers中获取filename, 后端response.setHeader("Content-disposition", "attachment; filename=xxxx.xlsx") 设置的文件名;
const contentDisposition = decodeURI(res.headers['content-disposition'])
const result = contentDisposition.replace(/\s+/g, '').replace('filename=', '').split(';')
const fileName = result[1]
aLink.href = URL.createObjectURL(blob)
aLink.setAttribute('download', fileName) // 设置下载文件名称
document.body.appendChild(aLink)
aLink.click()
document.body.removeChild(aLink)
}
最后一定要记录将responseType设置为blob，以 axios 为例：
config.responseType = 'blob'
