我们都知道下载文件有一种很简单的方法：window.open(url)，但是window.open(url)只是一个纯粹的访问下载文件的链接，并不能满足所有下载文件的需求。
1.前端下载文件有时候会根据权限去下载（需要获取登录的token）
2.有时后端提供的是post请求的接口
这时就需要用到blob啦：
Blob 对象表示一个不可变、原始数据的类文件对象。Blob 表示的不一定是JavaScript原生格式的数据
方法：
在请求头部添加responseType:"blob"
responseType属性是一个枚举类型的属性,返回响应数据的类型。它允许我们手动的设置返回数据的类型。
当下载文件时，axios配置responseType: ‘blob’，此时后台返回的数据会被强制转为blob类型；如果后台返回代表失败的data，前端也无法得知，依然会下载得到名为undefined的文件。
解决：将blob转回json格式，通过code判断是否下载成功
axios配置：
axios({
method: ‘post‘,
url: ‘/beisenassess/getExamDetailByCandidateId‘,
responseType: ‘blob‘,
})
.then(res => {
// 假设 data 是返回来的二进制数据
const data = res.data
const jsonData = JSON.parse(res)
if(jsonData.code !=‘200‘){
alert(‘下载失败‘)
return
}
const url = window.URL.createObjectURL(new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"}))
if(window.navigator && window.navigator.msSaveOrOpenBlob){
window.navigator.msSaveOrOpenBlob(new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"}), ‘下载文件.xlsx‘);
}else{
const link = document.createElement(‘a‘)
link.style.display = ‘none‘
link.href = url
link.setAttribute(‘download‘, ‘下载文件.xlsx‘)
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
window.URL.revokeObjectURL(url)
}
})
原文：https://www.cnblogs.com/myyouzi/p/11365028.html