微信小程序保存多图到系统相册

utils目录下download.js 文件

//保存图片到相册
export const writePhotosAlbum = (successFun, failFun) => {
  wx.getSetting({
    success(res) {
      if (!res.authSetting['scope.writePhotosAlbum']) {
        wx.authorize({
          scope: 'scope.writePhotosAlbum',
          success: function () {
            successFun && successFun()
          },
          fail: function (res) {
            wx.hideLoading()
            wx.showModal({
              title: '提示',
              content: "小程序需要您的微信授权保存图片,是否重新授权?",
              showCancel: true,
              cancelText: "否",
              confirmText: "是",
              success: function (res2) {
                if (res2.confirm) { //用户点击确定'
                  wx.openSetting({
                    success: (res3) => {
                      if (res3.authSetting['scope.writePhotosAlbum']) {
                        //已授权
                        successFun && successFun()
                      } else {
                        failFun && failFun()
                      }
                    }
                  })
                } else {
                  failFun && failFun()
                }
              }
            });
          }
        })
      } else {
        successFun && successFun()
      }
    }
  })
}

load.wxml

<view class="btn" bindtap="downLoadAll">下载多张图片</view>

load.js

// pages/test/test.js
import { writePhotosAlbum } from '../../utils/download'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    list: [
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160008479.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160013201.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160015969.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160025498.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160031519.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160042689.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160108243.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190301160111756.jpg',
      'https://timgs.top1buyer.com/admin/special/special_img_20190304160141454.jpg'
    ],
    loading: false
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },
  downLoadAll() {   //物料多个下载
    // 下载图片

      var _this = this
      // 获取保存到相册权限
      writePhotosAlbum(
        function success() {
          wx.showLoading({
            title: '加载中',
            mask: true
          })
          // 调用保存图片promise队列
          _this
            .queue(_this.data.list)
            .then(res => {
              wx.hideLoading()
              wx.showToast({
                title: '下载完成'
              })
            })
            .catch(err => {
              wx.hideLoading()
              console.log(err)
            })
        },
        function fail() {
          wx.showToast({
            title: '您拒绝了保存到相册'
          })
        }
      )
  },
  // 队列
  queue(urls) {
    let promise = Promise.resolve()
    urls.forEach((url, index) => {
      promise = promise.then(() => {
        return this.download(url)
      })
    })
    return promise
  },
  // 下载
  download(url) {
    return new Promise((resolve, reject) => {
      wx.downloadFile({
        url: url,
        success: function (res) {
          var temp = res.tempFilePath
          wx.saveImageToPhotosAlbum({
            filePath: temp,
            success: function (res) {
              resolve(res)
            },
            fail: function (err) {
              reject(res)
            }
          })
        },
        fail: function (err) {
          reject(err)
        }
      })
    })
  }
})

参考链接:https://www.jb51.net/article/157338.htm

github地址:https://github.com/sunnie1992/soul-weapp.git

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值