Vue2/js 将文件内容转化为Blob对象并创建下载任务

源代码：

getResultFile(para)
	.then((res) => {
		if(res.data)
		{
		    // 声明data中的blob对象的类型
			var blob = new Blob([res.data],{
				type: ''// 可以自己去查data文件的后缀名对应的type值
			})
		    // 创建超链接元素
			const downloadLink = document.createElement('a');
			const filename = this.backtest_id + '_' +  file_name;
			downloadLink.href = URL.createObjectURL(blob);
			// 转化为下载链接
			downloadLink.setAttribute(
				'download',filename
			)
			document.body.appendChild(downloadLink);
			downloadLink.click();// 触发点击事件
			document.body.removeChild(downloadLink);
		}
	})

通过调用接口获得了一个文件，格式如图（这样的格式是错的，哪怕把data转化为文件也会显示已损坏）

因为后端传数据默认以JSON格式，所以需要在接口处提前声明responseType为blob:

正确的格式应该为：

data属性中存放着文件内容，但是是字符串格式，需要转化为Blob（Binary Large Object：二进制大数据对象）后才能进行下载。

转化后的Blob对象格式如图：

之后通过创建下载类型的超链接元素实现下载，具体思路为：

document.createElement方法创建一个a元素

setAttribute方法定义类型为下载，并赋值文件名

触发a元素的点击事件，进行下载