微信小程序保存base64图片到相册(uni-app)
先上代码:
saveAlbum() { console.log("保存相册"); uni.getSetting({ //获取用户的当前设置 success: (res) => { if (res.authSetting['scope.writePhotosAlbum']) { //验证用户是否授权可以访问相册 this.saveImageToPhotosAlbum(); } else { uni.authorize({ //如果没有授权,向用户发起请求 scope: 'scope.writePhotosAlbum', success: () => { this.saveImageToPhotosAlbum(); }, fail: () => { uni.showToast({ title: "请打开保存相册权限,再点击保存相册分享", icon: "none", duration: 3000 }); setTimeout(() => { uni.openSetting({ //调起客户端小程序设置界面,让用户开启访问相册 success: (res2) => { // console.log(res2.authSetting) } }); }, 3000); } }) } }, error: (res) => { console.log('保存失败', res); } }) }, saveImageToPhotosAlbum(reportTimes) { if (!reportTimes) { reportTimes = 0; } let fileName = new Date().getTime(); let base64 = this.img.replace('data:image/jpeg;base64,', ""); //去掉data:image/png;base64, // let base64 = this.img; if (reportTimes == 1) { base64 += '='; } if (reportTimes == 2) { base64 += '=='; } console.log("图片base64长度", base64.length); console.log("图片base64末尾", base64.substr(base64.length - 4, base64.length)); // console.log("图片base64", base64); let filePath = wx.env.USER_DATA_PATH + '/homework' + fileName + '.jpg'; uni.showLoading({ title: '加载中', mask: true }); setTimeout(() => { uni.getFileSystemManager().writeFile({ filePath: filePath, //创建一个临时文件名 data: base64, //写入的文本或二进制数据 encoding: 'base64', //写入当前文件的字符编码 success: res => { uni.saveImageToPhotosAlbum({ filePath: filePath, success: function(res2) { uni.hideLoading(); uni.showToast({ title: '保存成功', icon: "none", duration: 1500 }); }, fail: function(err) { // console.log(err.errMsg); uni.hideLoading(); } }) }, fail: err => { if (reportTimes < 3) { this.saveImageToPhotosAlbum(reportTimes + 1); } } }) }, 500) },
在保存的失败回调函数里递归调用了保存,这样做的原因是调用微信的wx.getFileSystemManager().writeFile函数时,有时会报base64 fail encode error格式错误,把base64放在image的src中渲染是可以显示图片的。
base64有很多版本,wx能接受的版本应该是位数为3的整数倍,若不满足则使用= 号补位至3的整数倍位数。但是我尝试使用 base64.length%3判断补位的等号数量时,并不一定符合这一规则。
也就是说不同的base64不确定是否需要补0位,1位还是2位=号。
不得已只能使用递归依次尝试,直至保存成功,或三种都尝试且都失败为止。
本身是为了实现保存的一种临时妥协方案,如果后端可以直接返回图片链接还是使用图片链接比较好,base64由于编码原因,体积会比原图片增加1/3,请求速度会比较慢。
这是我的方案,希望有人能提出更科学的方案来解决base64格式差异的问题。

浙公网安备 33010602011771号