web端通过后端给的file流下载文件

• 说明 本例中使用axios发送请求

1. 首先设置请求的响应格式为blob

  //使用的axios拦截器对axios做了封装 所以这里只是函数调用,给axios发请求时添加配置
  export const reqMyReportDownload = params => {
    return service({
        url: `/web/own/report/v1/download/${params}`,
        method: 'get',
        responseType: 'blob'
    })
  }

2. 转化file流，添加后缀创建a标签实现下载

 reqMyReportDownload(record.id)
      .then(res => {
        const content = res  // 拿到file流
        const blob = new Blob([content])  //new Blob构造函数 转化链接使得可以直接在客户端上创建和操作 Blob(可下载文件）
        const fileName = record.reportName + '.doc' //添加后缀,指定要变成什么格式的文件 
        if (window.navigator.msSaveOrOpenBlob) { // 如果有 就提供打开和保存对象
          navigator.msSaveBlob(blob, fileName);
        } else { 
          //如果没有就手动创建a标签 设置样式  填入链接 下载 最后删除a标签
          const link = document.createElement('a');
          link.style.display = 'none';
          link.href = window.URL.createObjectURL(blob);
          link.download = fileName;
          document.body.appendChild(link); // 此写法兼容可火狐浏览器
          link.click()
          URL.revokeObjectURL(link.href) // 释放URL 对象
          document.body.removeChild(link)
        }
      })

• 关于blob构造函数 文章
  https://blog.csdn.net/weixin_37704921/article/details/84324923