前端做文件下载时,有时后端是返回base64或者数据流。这个时候就需要用a标签的下载功能了,但是a标签的下载功能对不同的浏览器又要有不同的操作。下面我们来介绍一下怎么做。
方法/步骤
1、a标签下载常规做法:vara=document.createElement('a')//先创建a标签a.href=base//base是后端返回的数据·a.download='下载.jpg'//下载的图片名a.click();//开始下载这样做完发现在IE里没有反应,原因是IE不支持a标签的download属性,IE需要用到msSaveBlob方法
2、a标签下载兼容IE做法:vara=document.createElement('a')//先创建a标签a.href=blob//base是后端返回的数据·a.download='下载.jpg'//下载的图片名if(navigator.msSaveBlob){//兼容IEvarblob=Blob([blob],{type:'image/jpg'});returnnavigator.msSaveBlob(blob,'月报报表.jpg');}a.click();//开始下载
3、在火狐发现也是不能下载,原因是body里没有a标签,解决的方法就是把创建的a标签添邹菁惨挣加到body里兼容性所有浏览器的写法就是:vara=document.cr髫潋啜缅eateElement('a')//先创建a标签document.body.appendChild(a);a.style.display='none';a.href=blob//base是后端返回的数据·a.download='下载.jpg'//下载的图片名if(navigator.msSaveBlob){//兼容IEvarblob=Blob([blob],{type:'image/jpg'});returnnavigator.msSaveBlob(blob,'月报报表.jpg');}a.click();//开始下载