后端返回文件流，前端获取、下载问题记录

I'm李刚

于 2020-10-16 15:51:36 发布

阅读量1.9k

点赞数 2

分类专栏： vue js web前端

本文链接：https://blog.youkuaiyun.com/weixin_42421494/article/details/109118141

版权

web前端同时被 3 个专栏收录

12 篇文章

订阅专栏

vue

8 篇文章

订阅专栏

3 篇文章

订阅专栏

最近项目遇到一个问题。导出功能后端直接返回了文件流，需要前端下载到本地。

首先尝试了blob方法转换文件流的本地地址，使用a标签下载

ActivityService.activityExport(data).then(res => {
     // 使用blob转换文件流
     var blob = new Blob([res], {type: 'application/vnd.ms-excel'})
     var link = document.createElement('a');
     link.href = window.URL.createObjectURL(blob);
     link.download = '文件名';
     link.click();
})

此时文件可以下载，但是打开失败。查找资料后找到了方法

在请求时添加responseType = 'arraybuffer'，此时后端返回的文件经过转换就可以正常下载打开了。