问题
使用a标签download,在ie下会在网页直接打开,无法下载到本地。
解决
//文件地址
var url = '../file/test.xlsx';
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = "blob"; // 返回类型blob
// 定义请求完成的处理函数,请求前也可以增加加载框/禁用下载按钮逻辑
xhr.onload = function() {
// 请求完成
if(this.status === 200) {
// 返回200
var blob = this.response;
var href = window.URL.createObjectURL(blob); //创建下载的链接
//判断是否是IE浏览器,是的话返回true
if (window.navigator.msSaveBlob) {
try {
window.navigator.msSaveBlob(blob, 'test.xlsx')
} catch (e) {
console.log(e);
}
} else {
// 其他浏览器 创建a标签 添加download属性下载
var downloadElement = document.createElement('a');
downloadElement.href = href;
downloadElement.target = '_blank';
downloadElement.download = 'test.xlsx'; //下载后文件名
document.body.appendChild(downloadElement);
downloadElement.click(); //点击下载
document.body.removeChild(downloadElement); //下载完成移除元素
window.URL.revokeObjectURL(href); //释放掉blob对象
}
}
}
// 发送ajax请求
xhr.send()
ie 的 msSaveBlob 和 msSaveOrOpenBlob 方法允许用户在客户端上保存文件,方法如同从 Internet 下载文件,这是此类文件保存到“下载”文件夹的原因。
msSaveBlob 和 msSaveOrOpenBlob 之间的区别就在于前者仅为用户提供“保存”按钮,而后者不但提供“保存”按钮,还提供“打开”按钮。