前端兼容IE下載文件,阻止瀏覽器直接預(yù)覽文件(ajax)

??downloadFileFromText?=?(fileName,fileUrl)?=>?{

????const?xhr?=?new?XMLHttpRequest();

????xhr.open('get',?encodeURI(fileUrl),?true);//IE某些版本無法把中文自動編碼,所以需要用encodeURI手動編碼

????xhr.responseType?=?'blob';?//?返回類型blob

????//?定義請求完成的處理函數(shù),請求前也可以增加加載框/禁用下載按鈕邏輯

????xhr.onload?=?function?()?{

??????//?請求完成

??????//?返回200

??????const?blob?=?this.response;

??????const?href?=?window.URL.createObjectURL(blob);?//?創(chuàng)建下載的鏈接

??????//?判斷是否是IE瀏覽器,是的話返回true

??????if?(window.navigator.msSaveBlob)?{

????????try?{

??????????window.navigator.msSaveBlob(blob,?fileName);

????????}?catch?(e)?{

??????????console.log(e);

????????}

??????}?else?{

????????//?谷歌瀏覽器?創(chuàng)建a標簽?添加download屬性下載

????????const?downloadElement?=?document.createElement('a');

????????downloadElement.href?=?href;

????????downloadElement.target?=?'_blank';

????????downloadElement.download?=?fileName;?//?下載后文件名

????????document.body.appendChild(downloadElement);

????????downloadElement.click();?//?點擊下載

????????document.body.removeChild(downloadElement);?//?下載完成移除元素

????????window.URL.revokeObjectURL(href);?//?釋放掉blob對象

??????}

????};

????//?發(fā)送ajax請求

????xhr.send();

??};

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容