Blob下载 

.post('xxxxx接口地址')
.send(obj)//需要的参数
.responseType('blob');//重点！！！！！处理文件流

前端页面处理

.then((res) => {
     const blob = res.body;//接口返回的文件流
     const reader = new FileReader();
     reader.readAsDataURL(blob);
     reader.onload = (e) => {
              const a = document.createElement('a');
              a.download = `文件名称.xls`;//看需求是下载什么文件可以改后缀
   // 后端设置的文件名称在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);
     };
});

 二进制arraybuffer下载

// 请求接口是注意要添加接收形式
.post('xxxxx接口地址')
.send(obj)//需要的参数
responseType: 'blob', // 注意！





const blob = new Blob([res.data]) //res.data  接口返回的arraybuffer的位置；arrayBuffer流转成blob
var a = document.createElement('a')
var href = window.URL.createObjectURL(blob) // 创建下载的链接
a.href = href

// 注意：下载文件名必须要有 或者自定义或者直接取接口中带回的
a.download = 'export.xls' // 自定义下载后文件名
// 或者取后端返回的文件名 
//a.setAttribute('download', res.headers['content-disposition'].split('filename=')[1])

document.body.appendChild(a)
a.click() // 点击下载
document.body.removeChild(a) // 下载完成移除元素
window.URL.revokeObjectURL(href) // 释放掉blob对象

 接口返回下载地址，前端实现下载

        if (res.code === 1) {
          const link = document.createElement('a')
          //_blank表示在新窗口打开链接
          link.target = '_blank'
          link.href = res.data.url //接口中下载链接
          // link.setAttribute('download', '文件名字' + Date.now() + '.xls') // 下载文件的名称及文件类型后缀
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link) // 下载完成移除元素
        }

链接下载，实现下载的文件名为文件的原文件名

<a href="#" @click="downloadFile(record.fileUrl, record.fileName)">{{ text }}</a>
    

/**
* @params fileUrl 文件下载地址
*@params fileName 文件名
/
downloadFile (fileUrl, fileName) {
      let url = window.URL.createObjectURL(new Blob([fileUrl]))
      let link = document.createElement('a')
      link.style.display = 'none'
      link.href = url
      link.setAttribute('download', fileName)
      document.body.appendChild(link)
      link.click()
    }

下载文件的方法还有其他的可参考同类博客：下载文件_Sunny_lxm的博客-CSDN博客

 下载文件失败时，接口返回json格式，前端判断格式如果是json格式时前端接口弹出错误提示

const _this = this
.then((res) => {
// 文件下载失败时接口返回json格式，弹出报错提示
        if (res.type === 'application/json') {
          const reader = new FileReader()
          reader.onload = function () {
            const message = JSON.parse(reader.result).msg // msg:接口返回错误信息的key值
            _this.$message.error(message) // 将错误信息显示出来
            // ... 执行其他自定义逻辑代码
          }
          reader.readAsText(res)
          return
        }

     const blob = res.body;//接口返回的文件流
     const reader = new FileReader();
     reader.readAsDataURL(blob);
     reader.onload = (e) => {
              const a = document.createElement('a');
              a.download = `文件名称.xls`;//看需求是下载什么文件可以改后缀
               // 后端设置的文件名称在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);
     };
});

前端返回的文件流pdf在浏览器新标签页打开

api(params).then((res) => {
        const blob = new Blob([res])
        const blobUrl = URL.createObjectURL(blob)
        const reader = new FileReader()
        reader.onload = function() {
          const pdfData = reader.result
          // 创建新的 Blob 对象
          const pdfBlob = new Blob([pdfData], { type: 'application/pdf' })
          const pdfUrl = URL.createObjectURL(pdfBlob)
          const a = document.createElement('a')
          a.href = pdfUrl
          a.target = '_blank'
          a.click()
          URL.revokeObjectURL(pdfUrl) // 释放URL对象
        }
        reader.readAsArrayBuffer(blob)
      }).catch((err) => {
        console.error(err)
      })