继上一节课,咱们已经简要说明了将图片保存到相册的流程和方法。
这节课咱们围绕这个问题,展开讲解获取用户权限,将网络图片下载到临时文件,最后保存到相册。小程序
使用方法以下:缓存
// 能够经过 wx.getSetting 先查询一下用户是否受权了 wx.getSetting({ success(res) { if (!res.authSetting[scope]) { wx.authorize({ scope: scope, success() { console.log('受权成功') } })}}})
这里的scope有5种参数,使用中间那行接口的时候,就要获取相应的scope权限。
这里咱们拿scope.writePhotosAlbum为例。
咱们在小程序初始化的时候获取权限,也能够在要保存图片的时候获取权限。
保存运行效果以下:
这里还有一个调试小技巧。markdown
清楚受权缓存,就能够不断调试受权。网络
咱们在点击图片的响应事件里面调用下载文件的方法数据结构
showImg:function(event){ var imgSrc = event.currentTarget.dataset.imgSrc; //下载文件 wx.downloadFile({ url:imgSrc, success:function (res){ console.log(res); } }) },
保存运行,点击图片。能够在console中查看日志。
这里的tempFilePath就是下载到本地的临时文件。
能够进一步的调用wx.saveFile将临时文件保存为永久文件。
注意这个文件大小限制了10M。ionic
接下来咱们将本地的临时文件,保存到相册里。函数
wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success:function(data){ console.log(data); }, fail:function(err){ console.log(err); } })
这里的res就是咱们调用下载文件的回调数据,实际代码结构以下:
保存运行,点击图片。
在工具上调试,会弹出保存窗口。
能够点击肯定、取消。
到这里咱们的功能就都完成了。
接下来咱们来看几种错误状况。
一、最开始用户点击了拒绝受权。(使用上面的调试技巧,清空一下受权记录)
错误码:errMsg:”saveImageToPhotosAlbum:fail auth deny”
二、用户点击了取消。
错误码:errMsg:”saveImageToPhotosAlbum:fail cancel”
三、若是一开始用户点击了拒绝受权,那就一直是拒绝的。
咱们在保存错误回调中加入一下测试代码
运行结果
工具
可是咱们有不少小程序的设计都是在用户赞成受权的状况下,才能正常使用的。
这里咱们能够经过调用wx.openSetting的方法打开受权设置页面。
修改咱们的测试代码。
保存运行。点击图片。
就会打开受权管理页面。
用户设置完成点击肯定,会响应success函数。
可是无论用户是否从新打开都是响应同一个函数。
因此咱们能够判断咱们须要的权限是否打开,
而后分别给出提示。
咱们修改wx.openSetting函数,保存运行。点击图片。测试
wx.openSetting({ success(settingdata){ console.log(settingdata) if (settingdata.authSetting.scope.writePhotosAlbum){ console.log('获取权限成功,给出再次点击图片保存到相册的提示。') }else{ console.log('获取权限失败,给出不给权限就没法正常使用的提示') } } })
这里有一个报错,咱们的代码里settingdata.authSetting.scope.writePhotosAlbum这样的取值猛地一看并无错误,这也是一个比较容易犯的一个错误,可能以为没有错,后面的scope.writePhotosAlbum对应图中红框中的属性名。可是按程序理解的话,上面的数据结构以下:url
settingdata:{ authSetting:{ scope:{ writePhotosAlbum:false } } }
因此这里咱们修改一下settingdata.authSetting.scope.writePhotosAlbum,改为settingdata.authSetting[‘scope.writePhotosAlbum’]。这里就是js中的两种取值方式了,点取值和中括号取值,中括号有一个最大的有点就是中括号内能够写一个变量。
保存运行,点击图片。先直接点击关闭,再点击图片,勾选权限,再点击关闭。日志以下:
源代码:百度云 连接:http://pan.baidu.com/s/1dFgtiHN 密码:77yw
这节课的内容就到这里结束了。
感谢您的阅读。
我是莽夫,但愿你开心。
若是你以为本文对你有帮助,请扫描文末二维码,支持博主原创。
但愿你们关注个人我的公众号ionic_