微信小程序base64圖片保存到手機相冊


問題:base64圖片不能直接用wx.saveImageToPhotosAlbum保存到手機相冊

解決:

先用fs.writeFile寫入本地文件,再wx.saveImageToPhotosAlbum保存到手機相冊

saveimg:function(){
    var _this=this
    //獲取文件管理器對象
    const fs = wx.getFileSystemManager()
    
    //文件保存路徑
    const Imgpath = wx.env.USER_DATA_PATH + '/qrcodeImg' + '.png'
    //_this.data.imgsrc   base64圖片文件
    let imageSrc = _this.data.imgsrc.replace(/^data:image\/\w+;base64,/, '')
    
    //寫入本地文件
    fs.writeFile({
      filePath: Imgpath,
      data: imageSrc,
      encoding: 'base64',
      success (res) {
        console.log(res)
        
        //保存到手機相冊
        wx.saveImageToPhotosAlbum({
          filePath: Imgpath,
          success(res) {
            console.log(res)
            wx.showToast({
              title: '保存成功',
              icon: 'success'
            })
          },
          fail:function(err){
            console.log("失敗了")
            console.log(err)
          }
        })
        
        
      }
    })
  },

存儲的話上面就可以實現了,下面是如果需要,刪除文件的方法

項目中有遇到過,因為接口返回的畫海報的圖片是base64的圖片,需要先存為本地文件才可以畫圖,canvas畫完海報素材還在臨時文件中,不一會就滿了,這時候就需要將臨時文件中不需要的文件刪除了,就用到如下方法:

Object wx.env

小程序環境變量對象

wx.env.USER_DATA_PATH

文件系統中的用戶目錄路徑

let fs = wx.getFileSystemManager()
//獲取文件 Stats 對象
fs.stat({
  // `${}` 是es6中新增的字符串方法
  // ` 返單引號
  path: `${wx.env.USER_DATA_PATH}`,
  recursive: true,
  success: res => {
    //獲取到stats對象
    
    //Object.keys(要返回其枚舉自身屬性的對象)  返回一個由一個給定對象的自身可枚舉屬性組成的數組,數組中屬性名的排列順序和正常循環遍歷該對象時返回的順序一致
    Object.keys(res.stats).forEach(path => {
      var stats = res.stats[path]
      
      //刪除指定路徑的文件
        fs.unlink({
          filePath:`${wx.env.USER_DATA_PATH}`+stats.path,
          success:function(res){
            //刪除成功
          },
          fail:function(res){
            //刪除失敗
          }
        })
        
    })
  },
fail:res=>{
//失敗
}
})

獲取的stats對象:

Object.keys(res.stats):


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM