首页 > 其他分享 >Blob文件下载方式

Blob文件下载方式

时间:2022-11-25 18:55:42浏览次数:39  
标签:文件 URL 下载方式 href Blob downloadElement document 下载 blob

 

responseType: 'blob' // 这一行是关键,拿到blob数据类型的文件

axios.request({
        url: "/bondParser/api/getParser",
        method: "post",
        headers: { "Content-Type": "application/x-www-form-urlencoded" },
        responseType: "blob",
    })
    .then(res => {

    })

 


通过a标签打开新页面下载文件

    console.log("下载文件内容", this.content)
      const blob = new Blob([this.content], {type: 'text/plain;charset=utf-8'})

      let downloadElement = document.createElement('a');
      let href = window.URL.createObjectURL(blob);           //创建下载的链接
      downloadElement.href = href;
      let time = (new Date()).valueOf();
      downloadElement.download = '代码库' + time + '.java'; //下载后文件名
      document.body.appendChild(downloadElement);
      downloadElement.click();                               //点击下载
      document.body.removeChild(downloadElement);            //下载完成移除元素
      window.URL.revokeObjectURL(href);                      //释放掉blob对象

 

 

 

通过a标签打开新页面下载文件  
//导出文件
// 通过a标签打开新页面下载文件
const a = document.createElement('a')
// 构造一个blob对象来处理数据
const blob = new Blob[res.data]
if (res.headers['content-disposition']) {
    // 拿到用户上传的文件名
    let fileName = res.headers['content-dispositon'].splice('filename=')[1]
    fileName = decodeURI(encodeURI(fileName))
    // URL.createObjectURL()会产生一个url字符串,可以像使用普通 URL 那样使用它,比如用在 img.src 上
    a.href = URL.createObjectURL(blob)
    // a标签里有download属性可以自定义文件名
    a.setAttribute(
        'download',
        fileName
    )
    document.body.appendChild(a)
    a.click();
    document.body.removeChild(a)
}

 

标签:文件,URL,下载方式,href,Blob,downloadElement,document,下载,blob
From: https://www.cnblogs.com/yeminglong/p/16926068.html

相关文章

  • 移动项目开发笔记(管理不同解决方案下的DLL文件相互引用之心得体会)
        目前这个项目进行到了最后阶段,对这个项目进行了重构,所以对项目的DLL文件的管理进行了整理,整理过程中有一些新的体会和朋友们分享。而且也学习了关于Post-buildeve......
  • 沃通CA证书支持多所高校招投标文件电子签名
    招投标电子化是国家大力推行的战略性工作,为贯彻落实电子招投标工作,各政企单位、高校均启动采购与招投标系统,自行组织的招标、单一来源等采购活动都通过该类系统在线进行。近......
  • 通过md5的值判断两个文件是否相同
    md5值用于文件比对linux中每个文件都会有1个md5值。当两个文件的md5值相同,表示这两个文件完全相同。md5值常用于大型文件的完整性检查,即给予方给出文件的同时给出md5值,接......
  • 如何实时监控是否有待发送的文件?
    客户在使用知行EDI系统发送文件时,有时候交易伙伴对文件的时效性要求非常严格,如果没有及时发出报文,有可能会影响供应商评级扣分,甚至被交易伙伴开具罚单。因此客户常常会有......
  • VUE读取本地json文件并解析
    //读取本地json文件exportfunctionGetUserAction(query){letquesa=axios.get('/json/userAction.json').then(res=>{//获取public下的buildmenu.json......
  • 11、go的文件操作
    文件创建一个测试文件代码测试:funcmain(){ //打开文件 file,err:=os.Open("E:/test/Test.txt") iferr!=nil{//err不为空,说明报错 fmt.Println("文件......
  • mybatis xml文件中用 if 标签判断字符串是否相等
    方法一:<iftest="delFlag=='2'.toString()">a.del_flag=#{delFlag}</if> 方法二:<iftest='delFlag=="2"'>a.del_flag=#{delFlag}</if> ......
  • WINDOWS下对NIGNX日志文件进行限制
    首先接到这个任务,发现nginx的日志限制更多的都是在Linux下做的,找了半天,也没找到能直接通过nginx.conf更改体现到日志限制上的。最后决定直接通过bat脚本,来对nginx......
  • IO文件读取
    一、I0文件读取1、bin目录下导入包:import   python的bin目录下的py模块或者文件py,package包可以直接导入用实例1:importunittestimportkeywordprint(keyword.......
  • 利用pandas的read_csv()读取data文件
    1.pycharm新建一个项目,如Python_paper_experiment2.下载一个.data数据集,如UCI数据集之iris.data(150个样本,五个属性:"sepallength","sepalwidth","petallength","pet......