【前端下载二进制流文件 】

前端下载二进制流文件 2种方法

通过readAsDataURL和createObjectURL方法接收blob对象，再创建a标签及事件下载二进制文件

//方法一
//后端设置的文件名称在res.headers的 "content-disposition": "form-data; name=\"attachment\"; 
console.log('getDownloadFile:', res.headers['content-disposition'])
let disposition = (res.headers['content-disposition']).split('"')
let filename = disposition[1] //文件名

//
const blob = res.data;
const reader = new FileReader();
reader.readAsDataURL(blob);//注意：readAsDataURL 应传入 blob对象   
reader.onload = (e) => {
const a = document.createElement('a');
  a.download = filename; // 下载下来的文件名 
  // 后端设置的文件名称在res.headers的 "content-disposition": "form-data; name=\"attachment\"; filename=\"20181211191944.zip\"",
  a.href = e.target.result;
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
};

//方法二 
// res.data 必须传入 blob对象  
const url = URL.createObjectURL(res.data);
const a = document.createElement('a');
a.style.display = 'none';
a.href = url;
a.download = name;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);

为什么csdn发文章代码区域 不自动展开 好恶心啊？