痛点是保存服务端返回的二进制数据流文件。
由于之前遇到的都是服务端直接返回文件地址,前端直接 window.open(url) 下载保存的,所以初次遇到文件流保存的,也是很头痛的。
初尝试
直接再用老办法试试?
window.open(res.data)
结果很尴尬,现象是从当前窗口 http://localhost:8083/#/list 新开了一个窗口 http://localhost:8083/[object%20ArrayBuffer]#/list ,并没有下载任何文件。
再尝试
总结之前的初尝试,发现很愚蠢:res.data 是一个二进制文件流,而平时我们使用 window.open(),参数带的是url,并不是任何其他格式的数据。
那么,我们接下来考虑,既然服务端返回的是一个二进制流,那么我们前端是不是有什么工具或者方法能够接收并处理这种二进制流的呢?
一番了解,Blob对象跳入眼中:
Blob是一种JavaScript的对象类型,表示一个不可变、原始数据的类文件对象。HTML5的文件操作对象,其他操作二进制数据的API(比如File对象),都是建立在Blob对象基础上的,继承了它的属性和方法。
完美对接。
let blob = new Blob([res.data], {
type: "appl