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

站长资源 2024/12/25 佚名

8 1538 8

铁雪资源网 Design By www.gsvan.com

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

　　功能逻辑：

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

　　上代码：

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

//点击保存图片
 save () {
  let that = this
  //若二维码未加载完毕，加个动画提高用户体验
  wx.showToast({
   icon: 'loading',
   title: '正在保存图片',
   duration: 1000
  })
  //判断用户是否授权"保存到相册"
  wx.getSetting({
   success (res) {
    //没有权限，发起授权
    if (!res.authSetting['scope.writePhotosAlbum']) {
     wx.authorize({
      scope: 'scope.writePhotosAlbum',
      success () {//用户允许授权，保存图片到相册
       that.savePhoto();
      },
      fail () {//用户点击拒绝授权，跳转到设置页，引导用户授权
       wx.openSetting({
        success () {
         wx.authorize({
          scope: 'scope.writePhotosAlbum',
          success() {
           that.savePhoto();
          }
         })
        }
       })
      }
     })
    } else {//用户已授权，保存到相册
     that.savePhoto()
    }
   }
  })
 },
//保存图片到相册，提示保存成功
 savePhoto() {
  let that = this
  wx.downloadFile({
   url: that.data.imgUrl,
   success: function (res) {
    wx.saveImageToPhotosAlbum({
     filePath: res.tempFilePath,
     success(res) {
      wx.showToast({
       title: '保存成功',
       icon: "success",
       duration: 1000
      })
     }
    })
   }
  })
 }

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

总结

以上所述是小编给大家介绍的微信小程序实现保存图片到相册功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！

微信小程序保存图片到相册,小程序保存图片到相册,微信小程序,保存相册

标签：