搜 索

通过axios设置responseType为"blob"获取文件流，若文件生成失败，拿到后端返回的json数据

  • 1.9k阅读
  • 2023年08月18日
  • 19评论
首页 / 前端技术 / 正文

因为设置了responseType: "blob"，导致后端返回json时，会导致把json也获取成blob，拿不到后端返回的message，故需要将blob转换成json获取

首先通过判断headers中是否有"content-disposition"，若没有怎证明是json不是文件流（this.$post是自己封装的axios，其实就是axios.post）

this.$post(url, obj, { responseType: "blob" }).then(res => {
    if (res.headers["content-disposition"]) {
        let downloadElement = document.createElement("a");
        let href = window.URL.createObjectURL(res.data); // 创建下载的链接
        downloadElement.href = href;
        downloadElement.download = decodeURI(res.headers["content-disposition"].match(/=(.*)$/)[1]); // 下载文件名
        document.body.appendChild(downloadElement);
        downloadElement.click(); // 点击下载
        document.body.removeChild(downloadElement); // 下载完成移除元素
        window.URL.revokeObjectURL(href); // 释放掉blob对象
    } else {
        let file = new FileReader();
        file.readAsText(res.data, "utf-8");
        file.onload = () => {
            let obj = JSON.parse(file.result); // 获取的json obj
            this.$message.error(obj.message)
        }
    }
})
前端小技巧
axios通过get请求获取图片的文件流时遇到的问题（附常用axios封装模板）
« 上一篇
vue3中实现全局自定义组件
下一篇 »
评论区
鍗庣撼鍏徃鍚堜綔寮€鎴锋墍闇€鏉愭枡锛熺數璇濆彿鐮?5587291507 寰俊STS5099 1周前
回复

寻找华纳圣淘沙公司开户代理（183-8890-9465薇-STS5099】

华纳圣淘沙官方合作开户渠道（183-8890-9465薇-STS5099】

华纳圣淘沙公司开户代理服务（183-8890-9465薇-STS5099】

华纳圣淘沙公司开户咨询热线（183-8890-9465薇-STS5099】

联系客服了解华纳圣淘沙开户

（183-8890-9465薇-STS5099】
华纳圣淘沙公司开户专属顾问

（183-8890-9465薇-STS5099】

鍗庣撼鍏徃鍚堜綔寮€鎴锋墍闇€鏉愭枡锛熺數璇濆彿鐮?5587291507 寰俊STS5099 1周前
回复

寻找华纳圣淘沙公司开户代理（183-8890-9465薇-STS5099】

华纳圣淘沙官方合作开户渠道（183-8890-9465薇-STS5099】

华纳圣淘沙公司开户代理服务（183-8890-9465薇-STS5099】

华纳圣淘沙公司开户咨询热线（183-8890-9465薇-STS5099】

联系客服了解华纳圣淘沙开户

（183-8890-9465薇-STS5099】
华纳圣淘沙公司开户专属顾问

（183-8890-9465薇-STS5099】

鍗庣撼鍏徃鍚堜綔寮€鎴锋墍闇€鏉愭枡锛熺數璇濆彿鐮?5587291507 寰俊STS5099 2周前
回复

华纳圣淘沙开户步骤详解（183-8890-9465—?薇-STS5099【6011643】

华纳圣淘沙公司开户流程全解析（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙公司账户注册指南（183-8890-9465—?薇-STS5099【6011643】
新手如何开通华纳圣淘沙公司账户（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙企业开户标准流程（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙公司开户：从零到一（183-8890-9465—?薇-STS5099【6011643】
官方指南：华纳圣淘沙公司开户流程（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙公司开户流程说明书（183-8890-9465—?薇-STS5099【6011643】

鍗庣撼鍏徃鍚堜綔寮€鎴锋墍闇€鏉愭枡锛熺數璇濆彿鐮?5587291507 寰俊STS5099 2周前
回复

华纳圣淘沙开户步骤详解（183-8890-9465—?薇-STS5099【6011643】

华纳圣淘沙公司开户流程全解析（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙公司账户注册指南（183-8890-9465—?薇-STS5099【6011643】
新手如何开通华纳圣淘沙公司账户（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙企业开户标准流程（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙公司开户：从零到一（183-8890-9465—?薇-STS5099【6011643】
官方指南：华纳圣淘沙公司开户流程（183-8890-9465—?薇-STS5099【6011643】
华纳圣淘沙公司开户流程说明书（183-8890-9465—?薇-STS5099【6011643】

鍗庣撼鍏徃鍚堜綔寮€鎴锋墍闇€鏉愭枡锛熺數璇濆彿鐮?5587291507 寰俊STS5099 3周前
回复

新盛客服电话是多少？（?183-8890-9465—《?薇-STS5099】【
新盛开户专线联系方式？（?183-8890--9465—《?薇-STS5099】【?扣6011643??】
新盛客服开户电话全攻略，让娱乐更顺畅！（?183-8890--9465—《?薇-STS5099】客服开户流程，华纳新盛客服开户流程图（?183-8890--9465—《?薇-STS5099】

鍗庣撼鍏徃鍚堜綔寮€鎴锋墍闇€鏉愭枡锛熺數璇濆彿鐮?5587291507 寰俊STS5099 3周前
回复

新盛客服电话是多少？（?183-8890-9465—《?薇-STS5099】【
新盛开户专线联系方式？（?183-8890--9465—《?薇-STS5099】【?扣6011643??】
新盛客服开户电话全攻略，让娱乐更顺畅！（?183-8890--9465—《?薇-STS5099】客服开户流程，华纳新盛客服开户流程图（?183-8890--9465—《?薇-STS5099】

鍗庣撼鍏徃鍚堜綔寮€鎴锋墍闇€鏉愭枡锛熺數璇濆彿鐮?5587291507 寰俊STS5099 2025年11月2日 15:46
回复

华纳东方明珠客服电话是多少？（▲18288362750?《?微信STS5099? 】
如何联系华纳东方明珠客服？（▲18288362750?《?微信STS5099? 】
华纳东方明珠官方客服联系方式？（▲18288362750?《?微信STS5099?
华纳东方明珠客服热线？（▲18288362750?《?微信STS5099?
华纳东方明珠24小时客服电话？（▲18288362750?《?微信STS5099? 】
华纳东方明珠官方客服在线咨询？（▲18288362750?《?微信STS5099?

muttrbirof 2025年10月7日 11:47
回复

2025年10月新盘 做第一批吃螃蟹的人coinsrore.com
新车新盘 嘎嘎稳 嘎嘎靠谱coinsrore.com
新车首发，新的一年，只带想赚米的人coinsrore.com
新盘 上车集合 留下 我要发发 立马进裙coinsrore.com
做了几十年的项目 我总结了最好的一个盘（纯干货）coinsrore.com
新车上路，只带前10个人coinsrore.com
新盘首开 新盘首开 征召客户！！！coinsrore.com
新项目准备上线，寻找志同道合的合作伙伴coinsrore.com
新车即将上线 真正的项目，期待你的参与coinsrore.com
新盘新项目，不再等待，现在就是最佳上车机会！coinsrore.com
新盘新盘 这个月刚上新盘 新车第一个吃螃蟹！coinsrore.com

qrihqizaix 2025年10月7日 11:34
回复

2025年10月新盘 做第一批吃螃蟹的人coinsrore.com
新车新盘 嘎嘎稳 嘎嘎靠谱coinsrore.com
新车首发，新的一年，只带想赚米的人coinsrore.com
新盘 上车集合 留下 我要发发 立马进裙coinsrore.com
做了几十年的项目 我总结了最好的一个盘（纯干货）coinsrore.com
新车上路，只带前10个人coinsrore.com
新盘首开 新盘首开 征召客户！！！coinsrore.com
新项目准备上线，寻找志同道合的合作伙伴coinsrore.com
新车即将上线 真正的项目，期待你的参与coinsrore.com
新盘新项目，不再等待，现在就是最佳上车机会！coinsrore.com
新盘新盘 这个月刚上新盘 新车第一个吃螃蟹！coinsrore.com

osvprlwbpb 2025年10月5日 08:37
回复

新盘新盘 这个月刚上新盘 新车第一个吃螃蟹！coinsrore.com

wrhcokonna 2025年10月5日 07:34
回复

新盘首开 新盘首开 征召客户！！！

dyhvjbpupx 2025年3月4日 19:57
回复

这篇文章如同一幅色彩斑斓的画卷，每一笔都充满了独特的创意。

erbnyhbvpm 2025年3月3日 06:27
回复

代码示例规范，注释详细，便于复现。

hnnrqwgyjb 2025年3月3日 04:44
回复

以小见大，从平凡事物中提炼普世价值。

mbqpapebdi 2025年3月2日 21:50
回复

内容的丰富性和深度让人仿佛置身于知识的海洋，受益匪浅。

pznezoqjkh 2024年12月12日 02:14
回复

通过axios设置responseType为"blob"获取文件流，若文件生成失败，拿到后端返回的json数据 - 逸仙的个人空间
apznezoqjkh
[url=http://www.gc101g6jfl8hqve46xre2wk65d044114s.org/]upznezoqjkh[/url]
pznezoqjkh http://www.gc101g6jfl8hqve46xre2wk65d044114s.org/

izoovndzyc 2024年05月08日 13:02
回复

通过axios设置responseType为"blob"获取文件流，若文件生成失败，拿到后端返回的json数据 - 逸仙的个人空间
izoovndzyc http://www.g00b39o41zxd0s68salxn675z0k548ncs.org/
aizoovndzyc
[url=http://www.g00b39o41zxd0s68salxn675z0k548ncs.org/]uizoovndzyc[/url]

mlmodfxxdn 2024年03月16日 03:25
回复

通过axios设置responseType为"blob"获取文件流，若文件生成失败，拿到后端返回的json数据 - 逸仙的个人空间
[url=http://www.gs2b8662605rw31uio25dd4fwy7qo01hs.org/]umlmodfxxdn[/url]
amlmodfxxdn
mlmodfxxdn http://www.gs2b8662605rw31uio25dd4fwy7qo01hs.org/

kncvtrym 2023年11月18日 18:18
回复

通过axios设置responseType为"blob"获取文件流，若文件生成失败，拿到后端返回的json数据 - 逸仙的个人空间
kncvtrym http://www.gae2rsr2l6pq12g0n307dn74y1328li3s.org/
[url=http://www.gae2rsr2l6pq12g0n307dn74y1328li3s.org/]ukncvtrym[/url]
akncvtrym

avatar