前端下载接口返回的流文件

1. 定义download方法

示例保存zip压缩包，保存excel只需将new 的Blob type换成 application/vnd.openxmlformats-officedocument.spreadsheetml.sheet 即可（其他格式自行摸索）

// data 接口返回的文件流 fileName下载到本地的文件名称
export const downloadZip = (data: any, fileName = '文件名称') => {
  var blob = new Blob([data], { type: 'application/zip' })
  if ('download' in document.createElement('a')) {
    //非IE下载
    var downloadElement = document.createElement('a')
    var href = window.URL.createObjectURL(blob) //创建下载的链接
    downloadElement.href = href
    downloadElement.download = fileName //下载后文件名
    document.body.appendChild(downloadElement)
    downloadElement.click() //点击下载
    document.body.removeChild(downloadElement) //下载完成移除元素
    window.URL.revokeObjectURL(href) //释放掉blob对象
  }
}

2. 调接口获取流

网络请求 下面XMLHttpRequest仅作参考 也可用axios、ajax等

需要注意的是 文件流的网络请求要设置responseType为blob（很关键！！！）

const formdata = new FormData()
  formdata.append('字段key', 字段值)
  const xhr= new XMLHttpRequest()
  xhr.onreadystatechange = function () {
    if (ajax.readyState == 4 && ajax.status == 200) {
      downloadZip(xhr.response)
    }
  }
  const url = '接口请求地址'
  xhr.open('POST', url )
  xhr.responseType = 'blob';
  // token鉴权 （登录获取）
  const token= 'token'
  xhr.setRequestHeader('Authorization', token)
  xhr.send(formdata)