请求返回文件流格式，实现下载文件功能，前端代码_let headername = xhr.getresponseheader("content-di-优快云博客

本文介绍了一种使用XMLHttpRequest进行文件下载的方法，包括设置请求类型、读取响应为blob数据、解析blob并触发文件下载的过程。适用于需要从服务器获取文件并直接在客户端保存的应用场景。


      let _this = this
      var xhr = new XMLHttpRequest();
      let link = process.env.VUE_APP_BASE_API+'/gbgl/downloadDoclist'
      xhr.open('POST', link, true);    // 也可用POST方式
      xhr.responseType = "blob";
      xhr.onload = function () {
        if (this.status === 200) {
          var blob = this.response;
          let fr = new FileReader()
          fr.readAsText(blob)
          fr.onload = (e)=>{
            let result = fr.result
            try{
              let msg = JSON.parse(result)
              _this.$message.error(msg.message)
            } catch(e){
              if (navigator.msSaveBlob == null) {
                var a = document.createElement('a');
                var headerName = xhr.getResponseHeader("Content-disposition");
                // console.log(headerName)
                var fileName = decodeURIComponent(headerName)
                if(fileName.indexOf('"')!=-1){
                  fileName = fileName ? fileName.split('filename="')[1] : '下载文件'
                  fileName = fileName ? fileName.split('"')[0]:'下载文件';
                } else {
                  fileName = fileName ? fileName.split('filename=')[1] : '下载文件'
                }
                a.download = fileName;
                a.href = URL.createObjectURL(blob);
                document.body.appendChild(a)
                a.click();
                URL.revokeObjectURL(a.href);
                a.remove();
                _this.$message({type:'success',message:'导出成功！'})
              } else {
                  navigator.msSaveBlob(blob, fileName);
              }
            }
          }
        } else {
          _this.$message({type:'error',message:this.statusText})
        }
      };
      xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
      xhr.setRequestHeader("token", getToken());
      let query = this.$copy(this.dataForm)
      query.degrees = query.degrees.filter(e=>e.degreeIds||e.educationBackgroundIds)
      query.cadres = this.cadres
      xhr.send(this.$http.adornData(query))