如何显示?
使用image标签,src属性添加data:image/png;base64,
(注意:若imgData返回数据中含有data:image/png;base64,时,src直接写src="{{imgData}}"即可)
<image src="data:image/png;base64,{{imgData}}"></image>
显示不出来?
按照上面的方法,但是图片显示不出来。。。
有一种原因是因为返回的base64的数据中存在回车换行,需要回车换行替换为''即可
var base64Image = 'base64数据' // 后台返回的base64数据
var imgData = base64Image.replace(/[\r\n]/g, '') // 将回车换行换为空字符''
如何保存?
使用writeFile及saveImageToPhotosAlbum API保存至相册,具体JS代码如下:
(注意:若imgData返回数据中含有data:image/png;base64,时,data参数需要写成: imgSrc.slice(22),意思为:这里是把 data:image/png;base64, 这一段去除)
var imgSrc = this.data.imgData;//base64编码
var save = wx.getFileSystemManager();
var number = Math.random();
save.writeFile({
filePath: wx.env.USER_DATA_PATH + '/pic' + number + '.png',
data: imgSrc,
encoding: 'base64',
success: res => {
wx.saveImageToPhotosAlbum({
filePath: wx.env.USER_DATA_PATH + '/pic' + number + '.png',
success: function (res) {
wx.showToast({
title: '保存成功',
})
},
fail: function (err) {
console.log(err)
}
})
console.log(res)
}, fail: err => {
console.log(err)
}
})