搜 索

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

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

因为设置了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设置responseType为"blob"获取文件流,若文件生成失败,拿到后端返回的json数据 - 逸仙的个人空间
izoovndzyc http://www.g00b39o41zxd0s68salxn675z0k548ncs.org/
aizoovndzyc
[url=http://www.g00b39o41zxd0s68salxn675z0k548ncs.org/]uizoovndzyc[/url]

mlmodfxxdn 2024年3月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