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

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

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

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

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

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

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

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

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

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

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

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

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

????????try?{

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

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

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

????????}

??????}?else?{

????????//?谷歌瀏覽器?創建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對象

??????}

????};

????//?發送ajax請求

????xhr.send();

??};

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。