前端导出文件流处理

原创已于 2022-12-12 15:19:48 修改 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#html #javascript #正则表达式

于 2022-12-12 15:19:18 首次发布

学习笔记专栏收录该内容

7 篇文章

订阅专栏

前端导出文件流处理

业务需求，需要处理后台返回的文件流，前台处理成文件在浏览器端下载即可

 $.ajax({
    "url": "../../db/exportDbRecord",
    "type": "GET",
    "contentType": "application/json",
    responseType: 'blob',  //必须加上，前台用Bob流接收
    success: function (data) {
        console.log(new Blob([data],{type:'application/zip'}));
        // 创建一个新的url，此url指向新建的Blob对象
        let url = window.URL.createObjectURL(new Blob([data],{type:'application/zip'}));
        let patt = new RegExp( 'filename=([^;]+ll.[ l.;]+);*')
        let contentDisposition = decodeURI(data.headers['content-disposition'])
        let result = patt.exec(contentDisposition);
        let fileName = result[0];
        // 创建a标签，并隐藏a标签
		let link = document.createElement('a');
		link.style.display = 'none';
		link.href = url;
		// 可以给name的后面，加上后缀格式.csv/.xsls，要和需要和后端返回格式一样
		link.setAttribute('download',name);
		document.body.appendChild(link);
	    link.click();
	    //点击下载完后释放a链接
	    window.URL.revokeObjectURL(url);
		document.body.removeChild(link);
    }
  })