vue中后端返回文件流（ type “applicationoctet-stream“ ）前端下载对应的格式文件

开发中遇到了所以记录一下。。。。

不废话，我直接直接上代码吧

这里还解决了后端传的json格式，前端下载不了json的文件问题

1、定义一个方法downLoadFUnOne

downLoadFUnOne(data, fileName) {      var reader = new FileReader();      var bData = data;      reader.readAsText(bData, "utf-8");      reader.onload = function(e) {        try {          var msg = JSON.parse(reader.result);          if (msg && msg.resultCode == "401") {            clearLoginInfo();            console.log("401-->token");            window.location.href = window.SITE_CONFIG.nspmGxb;          }          if(bData.type == 'application/json'){          // 将对象转为json字符串          const jsonStr = JSON.stringify(msg)          // 创建一个文本文件Blob对象          const blob = new Blob([jsonStr], { type: 'application/json' })          // 构造下载链接          const url = URL.createObjectURL(blob)          // 创建下载链接的a标签          const a = document.createElement('a')          a.href = url          a.download = fileName          // 模拟点击下载链接          document.body.appendChild(a)          a.click()          document.body.removeChild(a)          // 释放Blob占用的资源          URL.revokeObjectURL(url)        }        } catch (err) {          let content = data;          if (window.navigator.msSaveBlob) {            window.navigator.msSaveBlob(content, fileName);          } else {            let elink = document.createElement("a");            elink.download = fileName;            elink.style.display = "none";            let blob = new Blob([content], {              type: "application/octet-stream"            });            elink.href = URL.createObjectURL(blob);            document.body.appendChild(elink);            elink.click();            document.body.removeChild(elink);          }        }      };    },

2、点击下载在调用上面的downLoadFUnOne方法

downLoadFun(row,index) {      this.activeIndex = index        this.$http({          url: this.$http.adornUrl(            `server-mgr/assetExport/downloadAssetFile/${row.id}`          ),          method: "get",          responseType: "blob"          // data: this.$http.adornData(this.dataForm),        }).then(({ data }) => {          if(this.activeIndex == index){            this.downloadIcon = true          setTimeout(()=>{            this.downloadIcon = false          },3000)        }          this.downLoadFUnOne(data, row.fileName);          //   const contentDisposition = data.headers['content-disposition'];          //     const fileName = decodeURIComponent(contentDisposition.substring(contentDisposition.indexOf('=') + 1));          //     this.downLoadFUnOne(data.data,fileName)        });    },