小程序-保存图片,用户授权,拒绝授权等操作

<image class='recode' data-img='{{dataInfo.qrcode}}' bindtap='onSavePicClick' src='{{dataInfo.qrcode}}'></image>
1、用户点击图片弹出授权框
2、网络路径图片
3、用户点击了拒绝
4、getSetting事件需要tap触发
downloadImage: function (imageUrl) {
    // 下载文件  
    wx.downloadFile({
      url: imageUrl,
      success: function (res) {
        // 保存图片到系统相册  
        wx.saveImageToPhotosAlbum({
          filePath: res.tempFilePath,
          success(res) {
            wx.showToast({
              title: '保存成功',
            });
          },
          fail(res) {
            console.log("保存图片:fail");
          }
        })
      },
      fail: function (res) {
        console.log("下载文件:fail");
      }
    })
  },
  onSavePicClick: function (e) {
    var that = this;
    console.log("onSavePicClick");
    console.log(e);
    var downloadUrl = e.currentTarget.dataset.img;
 
    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']) {
          // 接口调用询问  
          wx.authorize({
            scope: 'scope.writePhotosAlbum',
            success() {
              that.downloadImage(downloadUrl);
            },
            fail() {
              // 用户拒绝了授权  
              wx.showModal({
                title: '保存图片',
                content: '保存图片需要您授权',
                showCancel: true,
                confirmText: '确定',
 
                success: function (res) {
                  if (res.confirm) {
                    // 打开设置页面  
                    wx.openSetting({
                      success: function (data) {
                        if (data.authSetting['scope.writePhotosAlbum']) {
                          that.downloadImage(downloadUrl);
                        } else {
                          console.log("授权失败");
                        }
                      },
                      fail: function (data) {
                        console.log("openSetting: fail");
                      }
                    });
                  } else if (res.cancel) {
                    console.log('用户点击取消')
                  }
 
                }
              })
 
 
 
            }
          })
        } else {
          that.downloadImage(downloadUrl)
        }
      },
      fail(res) {
        console.log("getSetting: fail");
        console.log(res);
      }
 
    })
 
  },
downloadImage: function (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);
}
})
},
onSavePicClick: function (e) {
var that = this;
console.log("onSavePicClick");
console.log(e);
var downloadUrl = e.currentTarget.dataset.img;

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']) {
// 接口调用询问  
wx.authorize({
scope: 'scope.writePhotosAlbum',
success() {
that.downloadImage(downloadUrl);
},
fail() {
// 用户拒绝了授权  
wx.showModal({
title: '保存图片',
content: '保存图片需要您授权',
showCancel: true,
confirmText: '确定',

success: function (res) {
if (res.confirm) {
console.log(12134);
// 打开设置页面  
wx.openSetting({
success: function (data) {
if (data.authSetting['scope.writePhotosAlbum']) {
console.log("授权成功");
that.downloadImage(downloadUrl);
} else {
console.log("授权失败");
}
},
fail: function (data) {
console.log("openSetting: fail");
}
});
} else if (res.cancel) {
console.log('用户点击取消')
}

}
})



}
})
} else {
that.downloadImage(downloadUrl)
}
},
fail(res) {
console.log("getSetting: fail");
console.log(res);
}

})

},
与尘埃中开出花朵。
原文地址:https://www.cnblogs.com/congfeicong/p/10254469.html