后端返回文件流和json格式的方式進行文件下載導出

1. 接口返回的類型是文件流的格式

fetch({
        url: this.exportUrl,
        method: "post",
        data: obj,
        noFormat: true,
        headers: {
          "Content-Type": "application/json; application/octet-stream"
        },
        responseType: "arraybuffer"
      }).then(result => {
        if (result.data.error_code) {
          this.$hMessage.error(result.data.error_message || "導出失敗！");
          return;
        }
        var b = new Blob([result.data], { type: "application/vnd.ms-excel" });
        // 根據傳入的參數b創建一個指向該參數對象的URL
        var url = URL.createObjectURL(b);
        var link = document.createElement("a");
        // 導出的文件名
       
        let fileName = "demo.xlsx";
        link.download = fileName;
        link.href = url;
        link.click();
      });

 

 

 

 

2. 接口返回的類型是json格式，里面字段對應base64格式的文件

fetch({
        url: this.exportUrl,
        method: "post",
        data: obj,
        noFormat: true,
        responseType: "json"
      }).then(result => {
        if (result.data.error_code) {
          this.$hMessage.error(result.data.error_message || "導出失敗！");
          return;
        }
    // 核心 將base64的字符串轉為文件流
        function dataURLtoBlob(base64Str) {
          var bstr = atob(base64Str), n = bstr.length, u8arr = new Uint8Array(n);
          while (n--) {
            u8arr[n] = bstr.charCodeAt(n);
          }
    // 下載的是excel格式的文件
          return new Blob([u8arr], { type: "application/vnd.ms-excel" });
        }
        var blob = dataURLtoBlob(result.data.result.base64);
        var downloadUrl = window.URL.createObjectURL(blob);

        var anchor = document.createElement("a");
        anchor.href = downloadUrl;
        anchor.download = decodeURI(result.data.result.filename);
        anchor.click();
        // window.URL.revokeObjectURL(blob);
      }).catch((e) => {
        this.$hMessage.error(e || "導出失敗！");
      });    

 

 

 

其他類型：
 //// 'doc' => 'application/msword',
 //// 'bin' => 'application/octet-stream',
 //// 'exe' => 'application/octet-stream',
 //// 'so' => 'application/octet-stream',
 //// 'dll' => 'application/octet-stream',
 //// 'pdf' => 'application/pdf',
 //// 'ai' => 'application/postscript',
 //// 'xls' => 'application/vnd.ms-excel',
 //// 'ppt' => 'application/vnd.ms-powerpoint',
 //// 'dir' => 'application/x-director',
 //// 'js' => 'application/x-javascript',
 //// 'swf' => 'application/x-shockwave-flash',
 //// 'xhtml' => 'application/xhtml+xml',
 //// 'xht' => 'application/xhtml+xml',
 //// 'zip' => 'application/zip',
 //// 'mid' => 'audio/midi',
 //// 'midi' => 'audio/midi',
 //// 'mp3' => 'audio/mpeg',
 //// 'rm' => 'audio/x-pn-realaudio',
 //// 'rpm' => 'audio/x-pn-realaudio-plugin',
 //// 'wav' => 'audio/x-wav',
 //// 'bmp' => 'image/bmp',
 //// 'gif' => 'image/gif',
 //// 'jpeg' => 'image/jpeg',
 //// 'jpg' => 'image/jpeg',
 //// 'png' => 'image/png',
 //// 'css' => 'text/css',
 //// 'html' => 'text/html',
 //// 'htm' => 'text/html',
 //// 'txt' => 'text/plain',
 //// 'xsl' => 'text/xml',
 //// 'xml' => 'text/xml',
 //// 'mpeg' => 'video/mpeg',
 //// 'mpg' => 'video/mpeg',
 //// 'avi' => 'video/x-msvideo',
//// 'movie' => 'video/x-sgi-movie',