微信小程序保存服务器图片到相册[通俗易懂]

大家好，欢迎来到IT知识分享网。

微信小程序保存图片到相册

1.注意:微信官方接口不支持保存网络图,如果是网络图则需要先下载转换路径之后再调用官方接口

2.demo
js代码

keep: function (e) {

var that = this
var imagePath = that.data.imagePath
wx.downloadFile({

// url:‘http://192.168.31.53:8081/studylaw/pic/1314.jpg’,
url: imagePath,
success: function (res) {

console.log(res)
if (res.statusCode === 200) {

let tempFilePath = res.tempFilePath;
wx.saveImageToPhotosAlbum({

filePath: tempFilePath,
success(res) {

          wx.showToast({
            title: '保存成功',
            icon: 'success',
            duration: 2000
          });

          that.setData({
            maskHidden: false
      
          });
        },
        fail(res) {
          wx.showToast({
            title: '保存失败',
            icon: 'success',
            duration: 2000
          });
        }
      });
    }
  }
});

},

wxml代码

wxss代码

.imagePathBox{ width: 100%; height: 100%; background:
rgba(0,0,0,0.7); position: fixed; top: 0; left: 0; right: 0;
bottom: 0; z-index: 9999999999999999; }

.create{ width: 80%; height: 80%; position: fixed; top:
50rpx; left: 50%; margin-left: -40%; z-index: 10; }

.poster-button{ position: fixed; bottom:50rpx; width: 100%;
height:80rpx; display: flex; flex-direction: row; align-items:
center; justify-content: center; }
.keep{ width: 45%; border-radius: 98rpx; display: flex; flex-direction: row; align-items: center; justify-content: center;
height: 80rpx; background: #6899FF; color: #ffffff; font-size:
28rpx; } button[class=“keep”]::after{ border: 0; }