原始代碼，是先創(chuàng)建一個a標簽，然后在生成一個url地址，在設(shè)置下載屬性，添加到DOM節(jié)點中，操作點擊事件，完了之后在移除a標簽節(jié)點。
核心代碼如下：
const blob = new Blob([res.data]);
const a = document.createElement('a');
a.href = window.URL.createObjectURL(blob);
a.download = fileName;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
使用IE11瀏覽器導(dǎo)出報錯拒絕訪問如下
image.png
在控制臺看了一下生成的節(jié)點，發(fā)現(xiàn)a標簽已經(jīng)生成了，卻發(fā)現(xiàn)a標簽的下載屬性未添加, 未實現(xiàn)點擊這一動作。
<a href="blob:5567C153-E677-4F45-9DB8-18C407E00880"></a>
使用 window.navigator.msSaveBlob(blob, defaultName) 代碼，去保存下載文件。
解決兼容性處理代碼如下
exportTable () {
this.loading = true;
let qusMethod = this.method == 'get' ? 'getDownAjax' : 'postAjax'; // 請求方式判斷(只考慮get和post兩種方式)
http[qusMethod](
this.url,
this.params,
{ responseType: 'blob'}
).then(res => {
if(res.status === 200) {
this.loading = false;
const blob = new Blob([res.data]);
let ext = this.ext || 'xlsx';
let fileName = `${this.filename}-${moment().format('YYYYMMDDHHmmss')}.${ext}`;
// ie兼容處理
if (window.navigator.msSaveBlob) {
window.navigator.msSaveBlob(blob, fileName);
} else {
const a = document.createElement('a');
a.href = window.URL.createObjectURL(blob);
a.download = fileName;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
}
} else {
this.$message.error("請刷新頁面重試！");
}
}).catch(error => {
console.log(error);
})
}
