微信小程序中base64转换成图片;uni-app小程序base64转图片;微信小程序base64文件转图片;微信小程序base64图片转图片

将微信小程序的图片转成base64 点击此链接看另一篇

以下是将后端返回的base64转成图片:

方法1:使用微信小程序自带方法

   //把base64转换成图片
    getBase64ImageUrl: (base64Url) {
        /// 获取到base64Data
        var base64Data = base64Url;
        /// 通过微信小程序自带方法将base64转为二进制去除特殊符号,再转回base64
        base64Data = wx.arrayBufferToBase64(wx.base64ToArrayBuffer(base64Data));
        /// 拼接请求头,data格式可以为image/png或者image/jpeg等,看需求
        const base64ImgUrl = "data:image/png;base64," + base64Data;
        /// 得到的base64ImgUrl直接给图片:src使用即可
        return base64ImgUrl;
    },

方法2:引用base64.js
2.1步骤1:先新建一个base64.js文件

const fsm = wx.getFileSystemManager();
const FILE_BASE_NAME = 'tmp_base64src'; //自定义文件名

function base64src(base64data, cb) {
  const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || [];
  if (!format) {
    return (new Error('ERROR_BASE64SRC_PARSE'));
  }
  const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
  const buffer = wx.base64ToArrayBuffer(bodyData);
  fsm.writeFile({
    filePath,
    data: buffer,
    encoding: 'binary',
    success() {
      cb(filePath);
    },
    fail() {
      return (new Error('ERROR_BASE64SRC_WRITE'));
    },
  });
};
module.exports = base64src;

2.2步骤2:在需要使用的页面引入方法在使用

var base64src = require('./base64.js')

getBase64ImgUrl:(res){
	//拿到后端给的base64字符串
	var shareQrImg = `data:image/jpg;base64,` + res.data.base64
	base64src(shareQrImg, resCurrent => {
	    this.imgUrl = resCurrent
	    //resCurrent就是base64转换后的图片,直接给图片对的:src即可
	})
}

版权声明:本文为i_am_a_div原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。