文件下载,下载服务端返回的二进制文件流
设置响应类型为 responseType: ‘blob’
// 定义服务端下载文件流接口
export async function downloadFile(params) {
return request({
url: 'download/excel',
method: 'get',
params,
// 设置响应类型为Blob对象。只是告诉服务器返回二进制数据,并不会自动将响应转换为Blob对象
responseType: 'blob'
})
}
处理服务端返回的数据
downloadFile().then(res => {
const fileName = `文件名称.xlsx`
// 将二进制转换为Blob对象
const blob = new Blob([res])
// 创建下载url
const url = window.URL.createObjectURL();
// 通过a元素触发下载
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', fileName);
link.style.display = 'none';
document.body.appendChild(link);
// 监听click事件。释放url
link.addEventListener('click', () => {
setTimeout(() => {
window.URL.revokeObjectURL(url);
}, 100);
})
link.click();
})
注:文件下载完成之后应该及时调用window.URL.revokeObjectURL(url)来释放这个url,以免造成内存泄露。