小程序 uni-app 保存图片到手机相册

最新推荐文章于 2025-06-24 22:21:48 发布

qingzhen568

最新推荐文章于 2025-06-24 22:21:48 发布

阅读量938

点赞数 1

CC 4.0 BY-SA版权

分类专栏： uni-app 小程序文章标签：小程序 uni-app

本文链接：https://blog.youkuaiyun.com/weixin_43919509/article/details/120703553

小程序同时被 2 个专栏收录

4 篇文章

订阅专栏

uni-app

3 篇文章

订阅专栏

本文介绍了一段JavaScript代码，展示了如何在使用微信小程序时获取用户手机相册的写入权限，并在授权后将图片保存到相册的过程。通过uni框架实现的步骤包括检查授权状态、请求授权、文件操作和相册保存。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

    // 1.先判断手机相册是否授权；2.授权后再保存到相册
    toSave() {
      uni.showLoading({
        title: "正在生成图片",
        mask: true,
      });
      uni.getSetting({
        success: (res) => {
          if (!res.authSetting["scope.writePhotosAlbum"]) {
            uni.authorize({
              scope: "scope.writePhotosAlbum",
              success: () => { // 授权成功
                uni.hideLoading();
                this.saveImg();
              },

              fail: (res) => {
                uni.hideLoading();
                uni.showToast('无法保存图片，请先授权')
              },
            });
          } else { // 已经授权！
            uni.hideLoading();
            this.saveImg();
          }
        },
      });
    },

    saveImg() {
      const base64Str = this.imgBase64.slice(22), // 注意这里,截掉 data:image/png;base64,
        buffer = uni.base64ToArrayBuffer(base64Str),
        filePath = wx.env.USER_DATA_PATH + "/base64src.png"; // base64src.png 为保存的图片名称

      uni.getFileSystemManager().writeFile({
        filePath, // 先把文件写到临时目录里
        // 方式一：
        data: buffer,
        encoding: "binary",
        // 方式二：
        // data: this.imgBase64.slice(22),
        // encoding: "base64",
        success: (res) => {
          uni.saveImageToPhotosAlbum({
            filePath, // 将临时文件 保存到相册
            success: (res) => {
              uni.showToast('图片保存成功')
            },
            fail: (error) => {
              uni.showToast('图片保存失败')
            },
          });
        },
        fail: (error) => {
          uni.showToast('图片保存失败')
        }
      });
    }