vue 下载excel文件流

1.设置请求头 responseType: 'blob'

后端接口

//导出
export function downloadCustomMechanismInfo(data){
    return request({
        url: '下载的接口地址',
        method: 'post',
        data,
        responseType: 'blob' 
    })
}

2.导出excel文件

import { Loading } from 'element-ui'
//方法一
export default {
    methods: {
        exportAllList(){
      const loadingInstance = Loading.service({
        fullscreen: true,
        background: '#fff0'
      })
      downloadCustomMechanismInfo({}).then(res=>{
        loadingInstance.close()
        const content = res
        const blob = new Blob([content])//处理返回
        const fileName = '自定义主机构信息.xls'
        if ('download' in document.createElement('a')) {
          // 非IE下载
          const elink = document.createElement('a')
          elink.download = fileName
          elink.style.display = 'none'
          elink.href = URL.createObjectURL(blob)
          document.body.appendChild(elink)
          elink.click()
          URL.revokeObjectURL(elink.href) // 释放URL 对象
          document.body.removeChild(elink)
        } else {
          // IE10+下载
          navigator.msSaveBlob(blob, fileName)
        }
      })
    },
    }
}




//方法二
downloadBtn() {
      if (this.selectList.length === 0) {
        this.$notify({
          title: '提示',
          message: '请先选中需要下载的数据',
          type: 'warning'
        })
        return false
      }
      const url =
        process.env.VUE_APP_BASE_API +
        '/bzcounterparty/exportExcel?ids=' +this.downloadData //下载数据需要传的数据
      window.open(url)
    },


//方法三
<script>
export default {
  methods: {
    //导出
    exportProduct(){
      const param = {
        bondShortName:this.form.bondShortName,
        compname:this.form.compname,
        fundName:this.form.fundName,
        startDate:this.form.startDate,
        endDate:this.form.endDate
      };
        //导出接口
      exportProductConcentration(param).then( res => {
        settleDocuments(res);
      }).catch(err =>{
        console.log(err);
      })
    },
  }
};
// 导出方法
function settleDocuments(content) {
  console.log(content);
  // 处理返回的文件流
  const blob = new Blob([content])
  const link = document.createElement('a')
  link.href = window.URL.createObjectURL(blob)
  link.download = '信息.xls'
  link.click()
}
</script>

3.请求拦截中添加responseType类型

if (config.url.indexOf('exportPledgeConcentration') != -1 || config.url.indexOf('exportProductConcentration') != -1) {
            config['responseType'] = 'blob'
        }