前端使用文件流接口下载文档的处理方法

GET方式:

func_export(){
      let url = "/xxx/xxx/xxx/downloadFile?fileName=" + fname;
      window.open(encodeURI(url));
    }

POST 方式:

func_export(){
      let params = {
          "userId":sessionStorage.getItem('userid'),
          "cardfalg":this.selState.length>0?this.selState[0].label:"",
          "create_starttime":this.beginTime==""?"":this.beginTime.replace(/-/g,''),
          "create_endtime":this.endTime==""?"":this.endTime.replace(/-/g,'')
      }
      console.log(params)
      let xhr = new XMLHttpRequest();
      xhr.open('POST', '/sisp/cardInfoService/statistic/exportUserDevice', true); 
      xhr.setRequestHeader('content-type', 'application/json');  
      xhr.responseType = "blob";    // 返回类型blob
      // 定义请求完成的处理函数,请求前也可以增加加载框/禁用下载按钮逻辑
      xhr.onload = function () {
        // 请求完成
          let blob = this.response;
          let fileName = '数据分析';
          fileName += ".xlsx";
          if (window.navigator.msSaveOrOpenBlob) {
              navigator.msSaveBlob(blob, fileName);
          } else {
              let link = document.createElement('a');
              link.href = window.URL.createObjectURL(blob);
              link.download = fileName;
              // 兼容火狐浏览器,a标签需在dom上
              let ff = document.getElementById('firefox');
              ff.appendChild(link);
              link.click();
              ff.removeChild(link);
              window.URL.revokeObjectURL(link.href);
          }
      };
      xhr.send(JSON.stringify(params));
    }

注意事项:POST方式的下载,使用axios会导致数据损坏,下载到的文件会发生错误,所以使用原生的XHR来处理

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值