前端处理后端返回来的blob对象

最新推荐文章于 2024-05-31 16:05:30 发布

记忆？格式化！

最新推荐文章于 2024-05-31 16:05:30 发布

阅读量2.8k

点赞数 1

文章标签：前端 javascript html vue.js

本文链接：https://blog.csdn.net/weixin_44009750/article/details/126300477

版权

前端处理后端返回来的blob对象

1、首先要把axios的请求配置改一下，加上这个配置，让axios知道返回的数据类型是blob（不然返回的东西直接变成了文件的内容，而不是文件本身）。

{ responseType: 'blob' }

2、具体实现代码如下：
其中res就是后端返回来的blob。

service.bug.download(formData).then(res => {
        // 处理后端返回来的流文件，把它转成正常文件，并下载
        let link = document.createElement('a')
        let href = window.URL.createObjectURL(res)
        link.href = href
        link.download = this.weakFile[index].fileName
        document.body.appendChild(link)
        link.click()
        document.body.removeChild(link)
        window.URL.revokeObjectURL(href) //释放掉blob对象
      })

3、本人这里是下载的逻辑，所以新建了a标签，并且模拟点击。请求发送成功之后，会在网页弹出下载的对话框。