首页 > 技术文章 > 微服务之excel导出

huangll99 原文

问题场景

在网关添加了权限校验,要求请求在header中携带token。前端获取到token之后存储在localstorage,请求时在请求拦截中取到token放在header中。excel导出一般的做法是用a链接指向excel导出接口,或者使用window.location.href = url 的方式,问题是这两种方式无法在header中携带token 。

解决方法

  • 使用axios发送post请求,将获取到的body数据放入Blog对象中,js代码使用Blog创建一个 url
  • 同时创建一个 a链接,将url赋值给a.href,js触发a.click下载文件。

代码实现

     exportExcel() {
        this.$axios(
          {
            method: 'post',
            url: '/api/addressbook/addressbookPerson/exportPersonlist',
            responseType: 'arraybuffer',
            data: {
              personName: this.queryPersonName
            }
          }
        ).then(res => {
          this.saveData(res.data, "通讯录人员.xlsx")
        }).catch((error) => {

        })
      },
      saveData(data, filename) {
        let blob = new Blob([data], {type: "application/vnd.ms-excel;charset=utf-8;"});
        let objectUrl = URL.createObjectURL(blob);
        let a = document.createElement('a');
        document.body.appendChild(a);
        a.style = "display:none";
        a.href = objectUrl;
        a.download = filename;
        a.click();
      }

推荐阅读