vue解析后端返回的二进制图片

1.开发环境 vue
2.电脑系统 windows10专业版
3.在开发的过程中,我们在数据交互的过程中,后端返回的图片是一个二进制的形式,前端vue怎么解析呢?下面我来分享一下。
4.废话不多说,后端返回的二进制是乱码:
vue解析后端返回的二进制图片
文章图片

很明显,后端返回的是一个 二进制的形式,那么我们如何解析呢?方法如下

5.vue解析后端返回二进制,代码如下:
export const badlisttabledetailsfiles = (value) => { return http1({ url: "/api/sys/image", method: "post", data: value, responseType: 'blob',// 关键代码 }); };

badlisttabledetailsfiles({ fileId: key, }).then((res) => { console.log("我是详情里面files接口"); console.log(res); let reader = new FileReader(); //关键代码 reader.readAsDataURL(res); // 关键代码 console.log(res); this.filesimgs = window.URL.createObjectURL(res); // 关键代码 console.log(this.filesimgs); this.filesimgsarr.push(this.filesimgs); });

6.效果如下:
vue解析后端返回的二进制图片
文章图片

// 经过一顿操作之后,后端返回的图片正常展示了

【vue解析后端返回的二进制图片】7.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰。

    推荐阅读