前端通过 post 下载文件

两种通用方法

  • window.open
  • 利用 blob 下载

什么是 blob ?

Blob,Binary Large Object的缩写,代表二进制类型的大对象。Blob的概念在一些数据库中有使用到,例如,MYSQL中的BLOB类型就表示二进制数据的容器。在Web中,Blob类型的对象表示不可变的类似文件对象的原始数据,通俗点说,就是Blob对象是二进制数据,但它是类似文件对象的二进制数据,因此可以像操作File对象一样操作Blob对象,实际上,File继承自Blob。

结合请求去用

服务端返回这种流文件格式

其实这个可能是一个 表格的文件流,如果用post 下载如何去下载呢? 废话不多说直接上代码:

fetch('Excel.do',{
			method: 'post',
			headers: {
				'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8',
				'Content-Type' : 'application/x-www-form-urlencoded'
			},
			'credentials': 'include',
			body: Serialize(this.getSearchParam()).substr(1)
		})
		.then(res => res.blob())
	    .then(blob => {
	        console.log(blob)
	        var a = document.createElement('a');
	        var url = window.URL.createObjectURL(blob);
	        var filename = time+'createUserSkuExcel.xls';
	        a.href = url;
	        a.download = filename;
	        a.click();
	        window.URL.revokeObjectURL(url);
	    })
复制代码

注意事项

  • 一定要知道文件名字
  • 兼容性目前只支持现代浏览器

你可能感兴趣的:(前端通过 post 下载文件)