小程序--保存图片到相册功能实现

小程序--保存图片到相册功能实现

　　项目中有个保存二维码到相册的功能，所以涉及到用户是否授权相册权限的问题。废话不多说，直接上干货...

 　　功能逻辑：

　　　先检查用户请求过的权限中是否允许"保存到相册"权限，如果没有请求过这个权限，应该向用户发起授权请求（弹窗授权），如果请求过这个权限并且授权了，那就保存图片，显示保存成功；如果请求过且拒绝授权,就跳到设置页，让用户重新授权。

　　上代码：

<view bindtap='save'>保存图片到相册</view>

 1 //点击保存图片
 2   save () {
 3     let that = this
 4     //若二维码未加载完毕，加个动画提高用户体验
 5     wx.showToast({
 6       icon: 'loading',
 7       title: '正在保存图片',
 8       duration: 1000
 9     })
10     //判断用户是否授权"保存到相册"
11     wx.getSetting({
12       success (res) {
13         //没有权限，发起授权
14         if (!res.authSetting['scope.writePhotosAlbum']) {
15           wx.authorize({
16             scope: 'scope.writePhotosAlbum',
17             success () {//用户允许授权，保存图片到相册
18               that.savePhoto();
19             },
20             fail () {//用户点击拒绝授权，跳转到设置页，引导用户授权
21               wx.openSetting({
22                 success () {
23                   wx.authorize({
24                     scope: 'scope.writePhotosAlbum',
25                     success() {
26                       that.savePhoto();
27                     }
28                   })
29                 }
30               })
31             }
32           })
33         } else {//用户已授权，保存到相册
34           that.savePhoto()
35         }
36       }
37     })
38   },
39 //下载图片地址并保存到相册，提示保存成功
40   savePhoto() {
41     let that = this
42     wx.downloadFile({
43       url: that.data.imgUrl,
44       success: function (res) {
45         wx.saveImageToPhotosAlbum({
46           filePath: res.tempFilePath,
47           success(res) {
48             wx.showToast({
49               title: '保存成功',
50               icon: "success",
51               duration: 1000
52             })
53           }
54         })
55       }
56     })
57   } 

　注：如果你不点击"保存到相册"的时候去看设置页，是没有"保存到相册"的开关的，只有点过了保存到相册，请求过这个弹窗授权后，设置页才会有"保存到相册"的开关

 

　兄弟姐妹们，如果有帮助，别忘了给个好评哟

posted @ 2018-11-30 10:26 RossDan 阅读( ...) 评论( ...) 编辑 收藏