小程序保存图片到手机代码抽离 代码片段 支持打开授权设置框 支持保存后的回调 支持base64图片

小程序保存图片到手机代码抽离 代码片段 支持打开授权设置框 支持保存后的回调 支持base64图片效果展示:

首次获取授权保存到相册

拒绝授权后再次保存图片 打开设置框请求授权

• 支持传入普通格式的url图片链接
• 支持传入base64格式的url图片链接
• 支持如果没有授权保存相册权限提示打开设置框
• 支持保存保存成功后回调

小程序代码片段：
https://developers.weixin.qq.com/s/PHx3dTmR7xJd

主要代码：

/**
 * 保存图片到用户手机  如果没有授权会打开小程序系统设置
 * @param {*} src 图片地址 必要 可以是base64图片链接 也可以是普通图片链接
 * @param {*} that this指向 非必要
 * @param {*} callback 保存图片到用户成功后的回调 非必要
 */

export const writePhotosAlbum = (src, that, callback) => {
    wx.showLoading({
      title: '图片保存中',
      mask: true,
    });
    if (src.indexOf('data:image/png;base64,') === 0) {
      // 图片src是base64格式组成的
      const ctx = wx.getFileSystemManager();
      const timestamp = new Date().getTime();
      const filePath = `${wx.env.USER_DATA_PATH}/${timestamp}.png`;
      ctx.writeFile({
        filePath,
        data: src.slice(22),
        encoding: 'base64',
        success: () => {
          saveImageToPhotosAlbumMethod(filePath, that, callback);
        },
        fail: () => {
          wx.hideLoading();
          wx.showToast({
            icon: 'none',
            title: '图片下载失败',
          });
        },
      });
    } else {
      // 图片src是直接可以下载的格式
      // wx.downloadFile方法：下载文件资源到本地
      wx.downloadFile({
        url: src, //图片地址
        success(res) {
          saveImageToPhotosAlbumMethod(res.tempFilePath, that, callback);
        },
        fail() {
          wx.hideLoading();
          wx.showToast({
            icon: 'none',
            title: '图片下载失败',
          });
        },
      });
    }
  };
  
  const saveImageToPhotosAlbumMethod = (filePath, that, callback) => {
    wx.saveImageToPhotosAlbum({
      filePath,
      success: () => {
        wx.hideLoading();
        wx.showToast({
          title: '保存成功',
        });
        if (callback && typeof callback === 'function') {
          callback.call(that);
        }
      },
      fail: (err) => {
        wx.hideLoading();
        if (
          err.errMsg === 'saveImageToPhotosAlbum:fail:auth denied' ||
          err.errMsg === 'saveImageToPhotosAlbum:fail auth deny' ||
          err.errMsg === 'saveImageToPhotosAlbum:fail authorize no response'
        ) {
          wx.showModal({
            title: '提示',
            content: '需要您授权保存相册',
            showCancel: false,
            success() {
              wx.openSetting({
                success(settingdata) {
                  if (settingdata.authSetting['scope.writePhotosAlbum']) {
                    wx.showModal({
                      title: '提示',
                      content: '获取权限成功,再次保存图片即可成功',
                      showCancel: false,
                    });
                  } else {
                    wx.showModal({
                      title: '提示',
                      content: '获取权限失败，无法保存到相册',
                      showCancel: false,
                    });
                  }
                },
              });
            },
          });
        }
      },
    });
  };