时间:2021-05-26
1、应项目要求,后台返回二进制流,而且乱码
2、红色为必须
this.$axios.post('/fishweb/agent/downLoad',this.stringify({filename:'qrCode.jpg'}), { responseType: 'arraybuffer' //指定返回数据的格式为blob }).then((res) => { var src='data:image/jpg;base64,'+ btoa(new Uint8Array(res).reduce((data, byte) => data + String.fromCharCode(byte), '')); this.srcImg = src; //图片回显 var link = document.createElement('a'); link.href = src; link.download = "qrCode.jpg"; link.click(); })补充知识:vue img src加载图片二进制问题记录
此 地址请求 http://xx.xx.xx.xx:xxxx/xx/.../xx/downLoadDoc?docId=xxxxx&access_token=xxxxx 返回的png二进制流。如下:
在项目中我使用img src直接对图片的二进制流加载,遇到频率很高的问题是前端发起的请求被服务器多次302重定向了,然后我访问的资源存在问题。
然后果断改为通过http get请求下来png 二进制流来处理。思路是通过responseType 制定返回数据格式为blob
请求的图片地址 url = http://xxxxxx:xxxx/xxx/xxx/merchDoc/downLoadDoc
axios({ method: "get", url, params: xxx, responseType:"blob" }).then(response => { this.picUrl = window.URL.createObjectURL(response);});解析blob 并展示在img src 中如下:
this.picUrl = window.URL.createObjectURL(response);
以上这篇vue下载二进制流图片操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
Android中图片的存在形式:1:文件形式:二进制形式存在与硬盘中。2:流的形式:二进制形式存在与内存中。3:Bitmap的形式三种形式的区别:文件形式和流的
二进制日志二进制日志记录了所有对数据库执行更改的操作,二进制主要有以下两种作用:1、恢复(recovery)2、复制(replication)二进制日志的启动:
1、将文件以二进制流的格式写入数据库首先获得文件路径,然后将文件以二进制读出保存在一个二进制数组中,与数据库建立连接,在SQL语句中将二进制数组赋值给相应的参数
1.将图片以二进制存入数据库2.读取二进制图片在页面显示3.设置Image控件显示从数据库中读出的二进制图片4.GridView中ImageField以URL方
本文实例为大家分享了Vue利用Blob下载原生二进制数组文件的具体代码,供大家参考,具体内容如下在服务端推送过来的二进制数组(JSON格式),在前端要处理成JS