使用Blob对象下载音频

最近遇到一个bug需要前端紧急短暂兼容一下，先描述一下情景；

有一款语音通话产品，所以就有通话记录，每一条通话记录都有录音，通话录音后端返回的都是播放链接，也就是文档流，所以在批量下载录音的时候是由前端收集通话ID后向后端发起请求然后后端再返回一个下载链接由前端直接访问。

遇到的问题是，当通话录音过长导致文件太大，就比如说一个小时的时候，后端处理时间太长前端请求会报错，后端为何处理时间太久这里就不细讲了，涉及到一些公司规定也业务要求。

临时解决方式：单个录音下载由前端直接下载，这样在遇到大文件时可以提示客户耽搁文件下载，当然这只是一个为了解决其中一个客户问题的临时解决方案。

OK，前端在拿到一个文件流之后转blob流，这样就可以下载了，代码如下：

//音频地址
let audioPath = '后端给的录音播放地址';
//音频名称
let audioName = '录音文件.mp3';
axios({
    method:'get',
    url:audioPath,
    responseType:'blob',
 }).then((res) => {
     // 为blob设置文件类型
     let blob = new Blob([res.data]);
     // 创建一个临时的url指向blob对象
     let url = window.URL.createObjectURL(blob); 
     //创建一个a标签，用来下载
     let a = document.createElement("a");
     a.href = url;
     a.download = audioName;
     a.click();
     // 释放这个临时的对象url
     window.URL.revokeObjectURL(url);
 })

这里涉及到一个我平时开发中并不常见的对象：Blob对象，Blob = Binary Large Object 的缩写，直译为二进制大对象,Blob()  构造函数返回一个新的 Blob对象。 blob的内容由参数数组中给出的值的串联组成。

var aBlob = new Blob( array, options );

• array 是一个由ArrayBuffer, ArrayBufferView, Blob, DOMString等对象构成的 Array ，或者其他类似对象的混合体，它将会被放进 Blob。DOMStrings会被编码为UTF-8。
• options 是一个可选的BlobPropertyBag字典，它可能会指定如下两个属性：
• type，默认值为 ""，它代表了将会被放入到blob中的数组内容的MIME类型。
• endings，默认值为"transparent"，用于指定包含行结束符\n的字符串如何被写入。 它是以下两个值中的一个： "native"，代表行结束符会被更改为适合宿主操作系统文件系统的换行符，或者 "transparent"，代表会保持blob中保存的结束符不变。