前端如何处理后台返回的文件流

前端如何处理后台返回的文件流?

处理方法:可以通过转化为blob对象的方式处理,具体方法如下:

1、在请求后台接口时需要把responseType设置为blob格式。

2、前端把后台返回的文件流转化为blob对象,然后利用window.URL.createObjectURL把blob对象转化为url,然后利用a标签进行下载。

放码过来:

downloadBlobFile(data, name) {
    if (window.navigator.msSaveOrOpenBlob) {
      // 兼容IE
      try {
        var blobObject = new Blob([encodeURI(data)]);
        window.navigator.msSaveOrOpenBlob(blobObject, fileName);
      } catch (e) {
        console.log(e);
      }
    } else {
      var blob = new Blob([data], {
        type: "application/octet-stream;charset=UTF-8"
      });
      var downloadElement = document.createElement("a");
      // 下载的文件名
      downloadElement.download = name;
      // 创建下载的链接
      downloadElement.href = window.URL.createObjectURL(blob); 
      // 点击下载
      downloadElement.click();
      document.body.appendChild(downloadElement);
      // 下载完成移除元素
      document.body.removeChild(downloadElement); 
       // 释放掉blob对象
      window.URL.revokeObjectURL(downloadElement.href);
    }
  }

  

posted @ 2021-06-03 20:44  闯入码途的水产人  阅读(3244)  评论(0编辑  收藏  举报