前端由于安全方面的因素，不能直接对文件进行写操作。
但是在实际的业务需求中，难免会遇到各种各样文件的下载、预览。
如果服务端下载文件是以流的形式传递到前端，前端通常是将流转换为objectURL,借用a标签的download属性，进行文件下载。
Bolb对象
定义
Blob表示二进制类型的大对象，通常是影像、声音或多媒体文件，在 javaScript中Blob表示一个不可变、原始数据的类文件对象。
其构造函数如下:
new Blob(blobParts, options);
blobParts:数组类型，可以存放任意多个ArrayBuffer, ArrayBufferView, Blob或者DOMString（会编码为UTF-8），将它们连接起来构成Blob对象的数据。options:可选项，用于设置blob对象的属性，可以指定如下两个属性：
– type：存放到blob中数组内容的MIME类型（默认为""），例如image/png。
– endings: 是否转换换行符，用于指定包含行结束符\n的字符串如何被写入。值为native表示行结束符会被更改为适合宿主操作系统文件系统的换行符（默认值为transparent表示会保持blob中保存的结束符不变）
例如：（从字符串创建 Blob）
let blob = new Blob(["<html>…</html>"], {type: 'text/html'});
请注意：第一个参数必须是一个数组 [...]
属性
Blob对象有两个属性，参见下表
| 属性名 | 描述 |
|---|---|
| size | Blob对象中所包含数据的大小。字节为单位。 只读。 |
| type | 一个字符串，表明该Blob对象所包含数据的MIME类型。如果类型未知，则该值为空字符串。 只读。 |
例如：
const blob = new Blob(['<div>john</div>'], { type: 'text/xml' });
console.log(blob); // Blob {size: 15, type: "text/xml"}
前端实现流文件下载
const res = await axiosRequest({url: state.exportUrl,method: 'post',data: form,responseType: 'blob', // 设置返回为二进制流
});
downloadSource(res); // 调用此方法实现下载流文件// 下载流
const downloadSource = (res: any) => {let url =(window.URL || window.webkitURL).createObjectURL(new Blob([res], { type:'application/zip'}));let link = document.createElement('a');link.style.display = 'none';link.href = url;link.setAttribute('download', `${这里写文件名})`);document.body.appendChild(link);link.click();document.body.removeChild(link);
}
new Blob的第二个参数可以按如下设置：
word文件：
.doc格式的设置为：application/vnd.msword;charset=utf-8
.docx格式的设置为：application/vnd.openxmlformats-officedocument.wordprocessingml.document
excel文件：
.xls格式的设置为：application/vnd.ms-excel
.xlsx格式的设置为：application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
zip文件：
. zip格式的设置为：application/zip
https://juejin.cn/post/6844904183661854727
https://juejin.cn/post/6916675943343849479
