美文网首页
【微信小程序】保存图片到本地相册

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

作者: RealHumans | 来源:发表于2019-01-17 15:15 被阅读0次

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

    首先需获取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)
              }
            })
         }
    })
    

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

    相关文章

      网友评论

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

          本文链接:https://www.haomeiwen.com/subject/wiridqtx.html