前端通过浏览器导出文件并下载

将文本或者JS字符串信息借助Blob转换成二进制，作为<a>元素的href属性，配合download属性，实现下载

let downloadFile=(fileStr:string,name:string)=>{

　　if ("download" in document.createElement("a")) {
　　　　let eleLink = document.createElement("a");
　　　　eleLink.download = name;
　　　　eleLink.style.display = "none";
　　　　let blob = new Blob([fileStr])
　　　　eleLink.href = URL.createObjectURL(blob)

　　　　//兼容firefox,元素添加到页面才能触发点击
　　　　document.body.appendChild(eleLink)
　　　　eleLink.click()
　　　　document.body.removeChild(eleLink)
　　}
}

 

对于非文本文件使用base64转换

 

let downloadFile=(domImage,name:string)=>{

　　if ("download" in document.createElement("a")) {
　　　　let eleLink = document.createElement("a");
　　　　eleLink.download = name;
　　　　eleLink.style.display = "none";
 
　　　　//图片转64
　　　　let canvas=document.ceateElement("canvas");
　　　　let context=canvas.getContext("2d");
　　　　let width=domImage.natureWidth,
　　　　　height=domImage.natureHeight;
　　　　context.drawImage(domImg,0,0);
 
　　　　//如果是png,则context.toDataURL("image/png");
　　　　eleLink.href=context.toDataURL("image/jpeg");

　　　　//兼容firefox,元素添加到页面才能触发点击
　　　　document.body.appendChild(eleLink)
　　　　eleLink.click()
　　　　document.body.removeChild(eleLink)
　　}
}

 

转载于:https://www.cnblogs.com/brainworld/p/8438155.html