【微信小程序】保存图片到本地相册

本章主要介绍保存图片到本地相册的几种方法及注意事项。

首先需获取scope.writePhotosAlbum权限。（放在wx.getSetting之前调用，建议放在onload中）

wx.authorize({
  scope: 'scope.writePhotosAlbum',
    complete() {
       
    }
})

整理一下，处理用户拒绝授权的情况

wx.getSetting({
      success(res) {
        console.log(res)
        if (!res.authSetting['scope.writePhotosAlbum']) {
          wx.openSetting({
            success(res) {
               //拒绝授权后重新提示授权，并授权成功
            }
          })
        }else{
          wx.saveImageToPhotosAlbum({
            filePath: 'imgs/home-icons/2019011709194.png',
            success(result) {
              //已授权过可直接执行保存图片
            }
          })
        }
      }
    })

注意调用 wx.openSetting页面不能用bindlongtap事件用bindtap，别保存图片就想当然的长按保存。

授权完成后执行保存图片，先看看微信的开发文档,需注意我用红框框起来的地方。

我说的两种方法一种是保存临时文件路径的图片，另一种是保存的永久文件的路径，看完两种方法怎样使用看个人选择。
还有一点需注意的是不可以使用网络图片路径，否则保存图片失败，提示路径错误，找不到图片路径。

方法一：保存永久文件路径的图片

永久图片路径即保存在微信小程序项目中的图片，例如：'imgs/index/1.png'
页面中给图片标签一个点击事件，绑定保存图片的方法，我把js方法贴上，非常简单。
先进行授权，授权成功后调用微信api即可

wx.saveImageToPhotosAlbum({
  filePath: 'imgs/home-icons/2019011709194.png',
    success(res) {
      console.log(res)
  }
})

方法二：保存临时文件路径的图片

这个就有点麻烦，需调用wx.getImageInfo或者wx.downloadFile，而调用这个api需在后台进行配置，把需用到的图片接口添加进去。

具体配置，登录微信公众平台，在开发---开发设置---服务器域名---添加downloadFile合法域名。
有两种写法：

wx.downloadFile({
  url: 'https://xxxx',
    success(res) {
      wx.saveImageToPhotosAlbum({
        filePath: res.tempFilePath,
          success(res) {
            console.log(res)
          }
      })
    }
})

wx.getImageInfo({
  src: 'https://xxx',
    success: function (res) {
      var path = res.path;
        wx.saveImageToPhotosAlbum({
          filePath: path ,
          success(res) {
            console.log(res)
          }
        })
     }
})

码字不易转载请注明出处，如若发现盗转，再也不更了，哼(︶︹︺)

最后编辑于：2019.01.17 15:23:50