【微信小程序】保存多张图片到本地相册 wx.saveImageToPhotosAlbum

本文主要是介绍【微信小程序】保存多张图片到本地相册 wx.saveImageToPhotosAlbum，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

这里写目录标题

微信小程序检测是否有存储权限
- wx.getSetting
图片上传
- 从HTML中提取img标签的src属性
- 多图片下载

微信小程序检测是否有存储权限

wx.getSetting

上传前判断是否开启存储权限，如果不检测直接上传会出现fail的情况

var _this = this
wx.getSetting({success(res) {if (res.authSetting['scope.writePhotosAlbum']) {// 已获得存储相册授权_this.writeInImg()}else {// 未获得存储相册授权wx.showModal({title: '提示',content: '需要您授权保存相册',showCancel: false,success: () => {wx.openSetting({success(settingdata) {//再进行图片上传操作_this.writeInImg()}})}})}}})

图片上传

从HTML中提取img标签的src属性

后端返回一个字符串，内容是标签，img，需要截取出src中的图片链接，

 getImage(){const srcRegex = /<img\s+(?:[^>]*?\s+)?src\s*=\s*(["'])((?:[^\1"]|\\\1|.)*?)\1/gconst result = [...this.data.details.goods_content.matchAll(srcRegex)]const imgSrcs = result.map(v => v[2])return imgSrcs[0]},

多图片下载

Page({/*** 页面的初始数据*/data: {imgList: ['https://tys.zye.com/upload/1/common/20231110/207169967318.jpg','https://tys.zye.com/upload/1/common/20231110/207169967318.jpg','https://tys.zye.com/upload/1/common/20231110/207169967318.jpg',	],
}writeInImg() {let imgList = this.data.imgList let imglength = imgList.length; // 要下载的总条数let index = 0;wx.showLoading({title: '加载中',})for (let i = 0; i < imgList.length; i++) {wx.downloadFile({url: imgList[i],success: function(res) {var temp = res.tempFilePathwx.saveImageToPhotosAlbum({filePath: temp,success(res) {index++;// 全部下载完后触发if (index == imglength) {wx.hideLoading();wx.showToast({title:'下载成功',icon:'success',duration:2000})}},fail(err){wx.hideLoading();console.log('下载失败')}})}})}},