小程序 | 如何把base64格式的图片数据保存至手机相册？

最新推荐文章于 2024-08-21 11:27:04 发布

原创

最新推荐文章于 2024-08-21 11:27:04 发布 · 4.2k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#小程序开发

本文介绍了如何将后端返回的base64格式图片数据保存到微信小程序用户的手机相册。通过使用小程序API wx.saveImageToPhotosAlbum()，首先将base64数据转换为ArrayBuffer，然后写入文件系统，获取临时路径，最后保存至相册。

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

需求描述：把后端返回的base64格式的图片数据，以图片的方式保存至手机相册。

解决文案：使用小程序官方API（wx.saveImageToPhotosAlbum()）实现图片至手机相册的保存。但是，filePath 不支持网络图片，所以我们需要先把 base64 格式的图片数据，写入到小程序的文件系统中去，进一步取得该图片的临时路径以完成保存至手机相册的任务。

把图片保存至相册

代码实现如下：

<view class="qr-image">
      <image src="{
  
  {`data:image/png;base64,${src}`}}"></image>
</view>

<view class="save" @tap="saveQrImage">保存到相册</view>

import wepy from 'wepy';

export function base64ImageHandle(base64) {
  // 指定图片的临时路径
  const path = `${wx.env.USER_DATA_PATH}/image_name.png`;
  // 把base64的图片转化成ArrayBuffer数据
  const buffer = wepy.base64ToArrayBuffer(base64);
  // 获取小程序的文件系统
  const fsm = wepy.getFileSystemManager();
  // 把arraybuffer数据写入到临时目录中
  fsm.writeFile({
    filePath: path,
    dat