1.实现效果

在这里插入图片描述

2.实现原理

2.1文档地址！！！保存图片，需要用户授权。

在这里插入图片描述

在这里插入图片描述

wx.saveImageToPhotosAlbum({
  success(res) { }
})

注意：保存的图片需要是临时文件路径或本地路径（不支持网络路径）

2.2 获取本地路径

wx.getImageInfo(Object object)

wx.getImageInfo({
  src: 'images/a.jpg',//==>图片的路径，支持网络路径、本地路径、代码包路径
  success (res) {
    console.log(res.path)//====>图片的本地路径
  }
})

2.3用户授权（需要 scope.writePhotosAlbum）

2.3.1获取用户授权设置

开发者可以使用 wx.getSetting 获取用户当前的授权状态。

wx.getSetting({
  success (res) {
    console.log(res.authSetting)
    // res.authSetting = {
    //   "scope.userInfo": true,
    //   "scope.userLocation": true
    // }
  }
})

在这里插入图片描述

2.3.2用户拒绝授权

用户拒绝授权，引导用户打开设置界面进行授权。
用户可以在小程序设置界面（「右上角」 - 「关于」 - 「右上角」 - 「设置」）中控制对该小程序的授权状态。开发者可以调用 wx.openSetting 打开设置界面，引导用户开启授权。

在这里插入图片描述

在这里插入图片描述

wx.openSetting({
  success (res) {
    console.log(res.authSetting)
    // res.authSetting = {
    //   "scope.userInfo": true,
    //   "scope.userLocation": true
    // }
  }
})

2.3.3 提前发起授权请求

开发者可以使用 wx.authorize 在调用需授权 API 之前，提前向用户发起授权请求。

在这里插入图片描述

在这里插入图片描述

3.实现代码

//相机授权
  isAuthorize() {
    return new Promise((resolve, reject) => {
      wx.authorize({
        scope: 'scope.writePhotosAlbum'
      }).then(() => {
        resolve()
      }).catch(() => {
        wx.getSetting().then(res => {
          if (!res.authSetting['scope.writePhotosAlbum']) {
            wx.showModal({
              title: '是否授权保存到相册',
              content: '请确认授权，否则无法保存到相册',
              success: res => {
                if (res.confirm) {
                  wx.openSetting()
                }
              }
            })
          }
        })
      })
    })
  },
 // 下载图片
  downloadImg() {
    let {
      poster
    } = this.data;
    // 下载文件不支持网络路径，需要先将网络路径转换为
    this.isAuthorize().then(() => {
      wx.getImageInfo({
        src: poster,
        success: (res) => {
          let path = res.path;
          wx.saveImageToPhotosAlbum({
            filePath: path,
            success: (res) => {
              util.toolsFn.toastMsg('保存成功！')
              this.setData({
                show_poster: true
              })
            },
            fail: (res) => {
              util.toolsFn.toastMsg('保存失败')
            }
          })
        },
        fail(res) {
          util.toolsFn.toastMsg('保存失败')
        }
      })
    })
  }

4.更多小程序源码，关注苏苏的码云，一起学习，共同进步。