微信小程序后端返回的不是图片地址,而是二进制图片流,前端渲染图片

博客介绍了在小程序中处理图片的方法。借助wx.request API获取图片二进制流,再用wx.arrayBufferToBase64将其转化为64进制,最后拼接图片的url。

遇到这种情况我们需要借助wx.request这个api成功获取到图片的二进制流,然后在通过wx.arrayBufferToBase64把图片的二进制流转化成正常的64进制,然后在拼接图片的url代码如下:

wx.request({
				url:url, //获取图片的URL
				method: "get",
				responseType: 'arraybuffer', //ArrayBuffer涉及面比较广,我的理解是ArrayBuffer代表内存之中的一段二进制数据,一旦生成不能再改。可以通过视图(TypedArray和DataView)进行操作。
				success: (res) => {
					let url = 'data:image/png;base64,' + wx.arrayBufferToBase64(res.data)
				
					this.imgurl = url
				},
				fail(res) {

				}
			})

页面效果如下:在这里插入图片描述

评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值