多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
上一篇我们分享了 [uni-app 微信小程序生成小程序码二维码带参数](https://www.aliyue.net/10291.html) 那么我们分享成功后就需要把生成的小程序码图片保存到相册,用于给他人分享。开始我以为不需要写什么,生成后长按就可以自己保存呢。我真是异想天开啊,没有那么简单,是需要我们写的呢,下面就来分享一下:uni-app 微信小程序如何把图片保存到本地相册? 效果图如下: ![](https://www.aliyue.net/wp-content/uploads/2020/12/1453624fafe0733.png) 思路: 1. 需要用户授权,允许保存到自己的相册 2. 将图片保存到用的手机上 根据以上思路我们就来写一下吧。 ~~~ savePoster() { 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); } }) } } }) }, ~~~ 下面来保存到手机相册 ~~~ saveImageToPhotosAlbum() { let base64 = this.src2.replace(/^data:image\/\w+;base64,/, ""); //去掉data:image/png;base64, let filePath = wx.env.USER_DATA_PATH + '/ph_fit_qrcode.png'; uni.showLoading({ title: '加载中', mask: true }) 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: 5000 }) }, fail: function(err) { uni.hideLoading(); // console.log(err.errMsg); } }) }, fail: err => { uni.hideLoading(); //console.log(err) } }) }, ~~~ 完成以上代码就可以实现把小程序的图片保存到手机相册了。