本身使用自带的接口将图片保存到本地相册,但没有接口文档中没有说明怎么设置保存图片的名称

小程序保存图片时,怎么自定义图片名称?本身使用自带的接口将图片保存到本地相册,但没有接口文档中没有说明怎么设置保存图片的名称。求解:适用于微信开发者工具的图片保存到本地的方法,可自定义图片名称。且可在真机上运行的实用方法。

img

自带的接口是指哪一个?

在小程序中,使用自带的 wx.saveImageToPhotosAlbum 接口将图片保存到本地相册时,默认情况下不支持自定义图片名称。

但是,你可以通过借助第三方库 js-file-download 来实现自定义保存图片的功能,具体步骤如下:

  1. 在小程序中安装 js-file-download 库
    使用 npm 包管理工具,在小程序项目的根目录下执行以下命令来安装 js-file-download 库:
npm install --save js-file-download
  1. 在需要保存图片的页面引入 js-file-download 库
    在需要保存图片的页面的 js 文件中,引入 js-file-download 库:
const fileDownload = require('js-file-download')
  1. 调用 wx.canvasToTempFilePath 接口生成临时文件路径
    使用 wx.canvasToTempFilePath 接口将目标图片转换成临时文件路径,示例如下:
wx.canvasToTempFilePath({
    canvasId: 'canvas',
    success: function(res) {
        console.log(res.tempFilePath) // 输出图片在本地的临时路径
    }
})
  1. 使用 fileDownload 库,下载临时文件并自定义文件名
    使用 fileDownload 库将临时文件下载到本地,并自定义文件名,示例如下:
wx.canvasToTempFilePath({
    canvasId: 'canvas',
    success: function(res) {
        console.log(res.tempFilePath) // 输出图片在本地的临时路径
        // 下载图片并自定义文件名
        fileDownload(res.tempFilePath, 'myImage.png')
    }
})

在上述示例中,我们使用 fileDownload 库的语法格式为 fileDownload(url, fileName),其中 url 是需要下载的文件路径,fileName 是自定义的文件名(包括文件类型后缀名)。因此,我们可以将 wx.canvasToTempFilePath 接口返回的临时文件路径作为 url,将自定义的文件名以字符串形式传递给 fileName,即可实现保存图片并自定义文件名称。

以上方法支持在微信开发者工具和小程序真机上运行。需要注意的是,在小程序真机上保存图片时,要求用户授权才能访问本地相册,因此我们需要在调用保存图片的方法前,先询问用户是否允许授权访问相册。可通过 wx.authorize 接口完成该功能。

您可以使用wx.getFileSystemManager()接口的saveFile方法将图片保存到本地文件夹后,再使用wx.saveImageToPhotosAlbum方法将该文件夹中的图片保存到相册中,并且可以自定义文件名。
示例代码如下:

const downloadImage = function (url) {
  return new Promise((resolve, reject) => {
    wx.downloadFile({
      url: url,
      success: function (res) {
        if (res.statusCode === 200) {
          resolve(res.tempFilePath)
        } else {
          reject(res)
        }
      },
      fail: function (err) {
        reject(err)
      }
    })
  })
}

const saveImage = function (filePath, fileName) {
  wx.getFileSystemManager().saveFile({
    tempFilePath: filePath,
    filePath: wx.env.USER_DATA_PATH + '/' + fileName,
    success: function (res) {
      wx.saveImageToPhotosAlbum({
        filePath: res.savedFilePath,
        success: function (res) {
          wx.showToast({
            title: '保存成功',
            icon: 'success',
            duration: 2000
          })
        },
        fail: function (err) {
          wx.showToast({
            title: err.errMsg || '保存失败',
            icon: 'none',
            duration: 2000
          })
        }
      })
    },
    fail: function (err) {
      wx.showToast({
        title: err.errMsg || '保存失败',
        icon: 'none',
        duration: 2000
      })
    }
  })
}

// 使用方式
downloadImage('https://example.com/image.jpg').then(filePath => {
  saveImage(filePath, 'custom_name.jpg')
})

此代码中,downloadImage函数用于下载网络图片并返回图片文件路径,saveImage函数用于保存图片到本地文件夹并保存到相册中。其中,filePath表示下载的图片路径,fileName表示自定义的图片文件名。
调用时,传入下载图片的URL和自定义图片文件名即可。

要通过后端配合修改文件名

可以借鉴下

要设置保存图片的名称,您需要使用一个文件名参数,并将其作为 SaveImageToGallery() 函数的参数之一。这样,您就可以在保存图像时指定一个自定义名称。这里是一个示例代码片段,展示了如何将文件命名为 "myImage.png"string fileName = "myImage.png";
byte[] imageData = // your image data

#if UNITY_ANDROID
string filePath = Path.Combine(Application.persistentDataPath, fileName);
#else
string filePath = Path.Combine(Application.temporaryCachePath, fileName);
#endif

File.WriteAllBytes(filePath, imageData);

AGGallery.SaveImageToGallery(filePath, fileName);
在这个示例中,fileName 参数被设置为 "myImage.png",然后使用 File.WriteAllBytes() 函数将二进制数据保存到一个本地文件。在最后一行代码中,使用 AGGallery.SaveImageToGallery() 函数将保存的图片添加到相册中,并使用 fileName 参数作为图片名称。

以下答案由GPT-4.5Plus大模型(语音)与博主A努力中.......共同编写:

根据您的描述,这里是微信小程序保存图片到本地相册并自定义图片名称的方法:

js
// 保存图片到本地相册
saveImg() {
  let that = this
  // 获取用户是否开启用户授权相册
  wx.getSetting({
    success(res) {
      // 如果没有则获取授权
      if (!res.authSetting['scope.writePhotosAlbum']) {
        wx.authorize({
          scope:"scope.writePhotosAlbum",
          success() {
            that.saveSuccess()
          },
          fail() {//如果用户拒绝过或没有授权,则再次打开授权窗口
            that.openSetting()
          }
        })
      } else {
        // 有则直接保存
        that.saveSuccess()
      }
    }
  })
  
  //保存图片
  saveSuccess() {
    var that=this;
    let filename = that.data.imgName // 自定义图片名称
    wx.saveImageToPhotosAlbum({
      filePath: that.data.shareImg, 
      success() { 
        wx.showToast({ title:"保存成功"})
      },
      fail() {
        wx.showToast({ title: '保存失败'})
      }
    })
  }
}

主要步骤:

  1. 调用wx.getSetting()检查用户是否授权访问相册,如果没有则调用wx.authorize()进行授权。
  2. 在saveSuccess()方法中调用wx.saveImageToPhotosAlbum()将图片保存到相册。
  3. 在wx.saveImageToPhotosAlbum()的调用中,通过filename参数指定想要的图片名称,从而实现自定义图片名称。
  4. 提示用户保存结果。

这段代码兼容微信开发者工具和真机,可以实现您所需要的自定义图片名称保存图片到本地相册的功能。