前端使用blob下载文件

1 篇文章 0 订阅

接口

export const areaStatisticsExport = (params = {}) => {
  return request({
    url: prefix + '/cmis-report/statistics/areaStatisticsExport',
    method: 'post',
    data: params,
    responseType: 'blob'
  })
};

js部分

areaStatisticsExport(trimForm(this.ruleForm))
  .then(res => {
    let _this = this;
    if (res.data.type === "application/json") {
      var blob = new Blob([res.data], {
        type: "application/vnd.ms-excel"
      });
      var reader = new FileReader();
      reader.readAsText(blob, "utf-8");
      reader.onload = function(e) {
        console.log(reader);// 一下为reader的输出值
        /**
        * FileReader { 			
        *  error: null
		*  onabort: null
		*  onerror: null
		*  onload: ƒ (e)
		*  onloadend: null
		*  onloadstart: null
		*  onprogress: null
		*  readyState: 2
		*  result: "{"code":400,"success":false,"data":{},"msg":"无数据导出"}"
		*  __proto__: FileReader
		* }
        */
        let resultObj = JSON.parse(reader.result);
        if (resultObj.code !== 0) {
          _this.$message({ message: resultObj.msg, type: "error" });
        }
      };
    } else {
      if (window.navigator.msSaveOrOpenBlob) {
        // 兼容IE
        try {
          var blobObject = new Blob([encodeURI(res.data)]);
          window.navigator.msSaveOrOpenBlob(blobObject, fileName);
        } catch (e) {
          console.log(e);
        }
      } else {
        var blob = new Blob([res.data], {
          type: "application/octet-stream;charset=UTF-8"
        });
        var downloadElement = document.createElement("a");
        downloadElement.download = "毕结业统计表.xls"; // 下载的文件名
        downloadElement.href = window.URL.createObjectURL(blob); // 创建下载的链接
        downloadElement.click(); // 点击下载
        document.body.appendChild(downloadElement);
        document.body.removeChild(downloadElement); // 下载完成移除元素
        window.URL.revokeObjectURL(downloadElement.href); // 释放掉blob对象
      }
    }
  })
  .catch(error => {
    this.exportLoding = false;
  });

说明

在这里插入图片描述
这个判断的意思就是: 在导出接口报错,或者没有数据可以导出的时候可以直接抛出异常,而不是下载一个表格,表格内容为在这里插入图片描述
在这里插入图片描述

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值