最近在做微信小程序,由于也是一边学习一边完成,把一些平时遇到的问题记录一下,方便以后查阅,也方便后面的人借鉴。
现在有一个需求:要在小程序里做一个分享朋友圈的功能。由于微信API暂时不支持分享朋友圈,于是想到另外一种方案,在微信小程序页面里先生成一个图片,这个图片里带二维码,然后再用这个图片发朋友圈,其他朋友就可以在朋友圈里识别这个二维码了。其中遇到的一些问题:
1.图片的生成
2.图片的下载
3.图片的保存
解决:
1.图片生成:这个比较简单,给服务端传入一些参数,服务端返回一个图片URL地址就可以了。
2.图片的下载:这个用到微信小程序的API:wx.downloadFile(OBJECT)
这个api是下载文件,属于网络服务,微信规定在用到网络相关的API时需要进行服务器域名配置,简单说就是登录微信后台,把这个下载域名配置在后台中就可以了。
3.图片的保存,这个图片保存在系统相册中,用到微信API:wx.saveImageToPhotosAlbum(OBJECT)
保存图片到系统相册需要用户授权
直接上代码:
1.下载和保存图片到系统相册中的代码:
function downloadImage(imageUrl) { // 下载文件 wx.downloadFile({ url: imageUrl, success: function (res) { console.log("下载文件:success"); console.log(res); // 保存图片到系统相册 wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success(res) { console.log("保存图片:success"); wx.showToast({ title: '保存成功', }); }, fail(res) { console.log("保存图片:fail"); console.log(res); } }) }, fail: function (res) { console.log("下载文件:fail"); console.log(res); } }) }
2.保存相册的授权代码:
onSavePicClick: function(){ console.log("onSavePicClick"); var downloadUrl = this.data.imageUrl; console.log("downloadUrl=" + downloadUrl); if (!wx.saveImageToPhotosAlbum) { wx.showModal({ title: '提示', content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。' }) return; } // 可以通过 wx.getSetting 先查询一下用户是否授权了 "scope.writePhotosAlbum" 这个 scope wx.getSetting({ success(res) { console.log("getSetting: success"); if (!res.authSetting['scope.writePhotosAlbum']) { console.log("1-没有授权《保存图片》权限"); // 接口调用询问 wx.authorize({ scope: 'scope.writePhotosAlbum', success(){ console.log("2-授权《保存图片》权限成功"); util.downloadImage(downloadUrl); }, fail(){ // 用户拒绝了授权 console.log("2-授权《保存图片》权限失败"); // 打开设置页面 wx.openSetting({ success: function(data) { console.log("openSetting: success"); }, fail: function(data) { console.log("openSetting: fail"); } }); } }) } else { console.log("1-已经授权《保存图片》权限"); util.downloadImage(downloadUrl) } }, fail(res) { console.log("getSetting: success"); console.log(res); } }) },