zoukankan      html  css  js  c++  java
  • 前端通过浏览器导出文件并下载

    将文本或者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)
      }
    }
  • 相关阅读:
    二维动态规划(2)
    细节是否真的打败爱情,十年后你还会爱我吗?
    C++的四种cast操作符的区别类型转换
    纯虚函数
    二维动态规划
    1,2,...n n个数m个丢失,找出丢失的数
    虚拟内存管理技术
    C++ 面试题总结
    【转】图的邻接链表 adjacent list of graph
    CIOCPServer的数据结构定义及内存池方案
  • 原文地址:https://www.cnblogs.com/brainworld/p/8438155.html
Copyright © 2011-2022 走看看