微信小程序处理后端返回图片二进制流，渲染页面

时间：2020-05-11 13:44:46 收藏：0 阅读：500

1.情况展示：后台接口返回二进制数据

2.在JS页面中，获取数据，转换数据

    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)
        that.setData({
          codeUrl : url,     //设置data里面的图片url
          show:true
        })
      },
      fail(res){
        Toast.clear();
      }
    })

3.在wxml文件中，使用image标签，如：

  <view>
    <image src=‘{{codeUrl}}‘></image>
  </view>