vue文件下载：把文件流保存到本地

开发vue项目时经常碰到文件下载的需求，分两种情况：

一种是：后台给文件路径，前端拼地址去下载文件

另一种是：后台直接返回文件流，前端去处理

第一种很简单这里就不赘述了，直接给出第二种接受文件流并下载的方法：

/**

* 把二进制文件保存到本地

* file 为后台返回的文件流

* 请求接口可能需要设置 responseType: "arraybuffer"

* name: 文件名，需要带后缀

*/

function exportFile (file, name) {

let url = window.URL.createObjectURL(new Blob([file]));

let link = document.createElement('a');

link.style.display = 'none';

link.href = url;

link.setAttribute('download', name);

document.body.appendChild(link);

link.click();

document.body.removeChild(link); // 下载完成移除元素

window.URL.revokeObjectURL(url); // 释放掉blob对象

}

关于 responseType: “arraybuffer”，可能需要加在请求接口上

//以axios为例子：

axios({

method: 'post',

url: '/user/12345',

data: {

firstName: 'Fred',

lastName: 'Flintstone'

},

responseType:'arraybuffer'

});

基本就这些，欢迎补充！没有人事先了解自己到底有多大的力量，直到他试过以后才知道。