#Blob 流文件下载

1/**
2 * 返回值文件类型为 blob 二进制流文件
3 * responseType: 'blob'
4 * params 接口所需参数
5 * 命名文件名:依据时间戳命名文件名
6 * 			(导出时需要延迟,否则导出文件失败,默认文件名时直接导出)
7 * */
8$axios
9	.get(`api`, {
10		responseType: "blob",
11		params
12	})
13	.then(res => {
14		// response 的返回值为二进制文件流
15
16		// 创建时间戳
17		let date = new Date(),
18			yyyy = date.getFullYear(),
19			MM = date.getMonth() + 1,
20			dd = date.getDate(),
21			hh = date.getHours(),
22			mm = date.getMinutes(),
23			ss = date.getSeconds();
24		var timeStr = `${yyyy}${MM}${dd}${hh}${mm}${ss}`;
25
26		// 导出二进制文件
27		setTimeout(() => {
28			// 创建URL对象 URL.createObjectURL(object)
29			let url = window.URL.createObjectURL(res.data);
30			let link = document.createElement("a");
31			link.style.display = "none";
32			link.href = url;
33			// 指定文件名&文件类型(后缀名)
34			let fileName = `Users${timeStr}CN.xls`;
35			/**
36			 * 添加属性,并赋指定的值 el.setAttribute('download','zzz')
37			 * demo: <a href="abc.gif" download="zzz">
38			 * download属性的值即使当前要导出的文件的文件名
39			 * */
40			link.setAttribute("download", fileName);
41			link.click();
42			// 释放创建的对象(创建的新的URL必须通过该方法释放)
43			window.URL.revokeObjectURL(url);
44		}, 500);
45	})
46	.catch(err => {
47		console.log("文件导出失败: ", err);
48	});