vue中axios实现二进制流文件下载

后端传过来的是一个二进制流方式的docx文件

之前试了下网上常见的思路, 但是带中文的txt会出现乱码, docx更是打不开, 估计编码还是有点问题, 概括这类方法思路如下:

1. 使用js在页面常见a标签

2. 创建Blob对象, 在Blob中传入后端返回的response.data

  这一步中Blob需要的是一个数组类型的参数, 后端二进制流这边接收到的response.data使用typeof查看发现是String, 所以我把response.data放进一个长度1的数组, 再传入Blob对象var blob = new Blob([res.data])

3. 创建下载链接 window.URL.create URLblob()

4. 把3创建的链接变量赋值个a标签的href属性(这类用法详见a标签文档)

5. 使用document.body.appendChild把a标签挂上去, 再调用a标签的.click()事件

6. document.body.removeChild(a标签) 移除a标签

7.window.URL.revoke UR()下载链接)释放blob对象

最后使用简单粗暴的方法完成下载, 直接打开新窗口, 用get方式传递参数完成下载:

download(){

    var url = 接口地址;

    url = url+\"?data=\"+encodeURI(JSON.stringify(this.data));  //get方式要encode一下, 后端接收参数data

    window.open(url);

},