先后端分离,导出数据为文件或下载文件,前端如何处理后端返回的数据

  在先后端分离的项目中涉及跨域问题,一般都会使用token进行验证。前端

  最近在先后端分离的项目中在一个问题上搞了好久,就是之前下载附件或者导出数据为文件的时候,在之前的那些项目前端能够直接用 window.location.href='后端url',window.open(url)或者其余的方式,可是在先后端分离中这种方式不能把token也一块儿传到后端进行请求,致使权限不够访问不了后端。json

  最后在多方面的尝试下,也和同事一块儿讨论,最后这么解决(直接附代码):后端

 1  /**
 2      * 导出用户列表
 3      */
 4     private exportUsers(){
 5         this.http.doPost({
 6             url: 'system/sysmanager/user/exportUsers', 
 7             responseType:ResponseContentType.Blob,  
 8             body:this.form,  //传入后端的表单数据
 9             success: (req, res) => {
10                 var blob = new Blob([res.json()]); //建立一个blob对象
11                 var a = document.createElement('a'); //建立一个<a></a>标签
12                 a.href = URL.createObjectURL(blob); // response is a blob
13                 a.download = "用户列表.xlsx";  //文件名称
14                 a.style.display = 'none';
15                 document.body.appendChild(a);
16                 a.click();
17                 a.remove();
18             }
19         });
20    }

开始觉得后端代码须要更改,其实后端代码不须要更改,输出的是输出流、或者字节数组前端均可以进行转换。跨域

这个博客有点简短,若是有什么意见或者问题欢迎你们指教。数组

相关文章
相关标签/搜索