1. 程式人生 > >微信小程式儲存圖片到相簿

微信小程式儲存圖片到相簿

先來看小程式中的儲存圖片到相簿的api

wx.saveImageToPhotosAlbum({
  filePath : "./test.png",   //這個只是測試路徑,沒有效果
  success(res) {
    console.log("success");
  },
  fail : function(res) {
    console.log(res);
  }
})

上面的saveImageToPhotosAlbum的用法是不能獲取到檔案的,因為filePath在官方的說法是可以是臨時檔案路徑永久檔案路徑

而"filePath : ./test.png"只是一個相對路徑(相對小程式專案來說的一個路徑),而我們需要的是臨時檔案路徑或永久檔案路徑。

下面說一下三者的區別:

相對路徑:小程式專案中相對的檔案路徑。

臨時檔案路徑:從網路上下載或其他形式生成的檔案,但是隻儲存在記憶體中,沒有儲存到小程式目錄中的檔案路徑。

永久檔案路徑:小程式專案中檔案中的全檔案路徑。

注:相對路徑和永久檔案路徑可能是同一個檔案,只是引用的路徑名不一樣而已(一個是相對的,一個是絕對的)。

其中臨時檔案路徑我們可以這樣獲得來儲存檔案到相簿:

wx.downloadFile({
  url: 'https://example.com/audio/123',     //僅為示例,並非真實的資源
  success: function (res) {
    // 只要伺服器有響應資料,就會把響應內容寫入檔案並進入 success 回撥,業務需要自行判斷是否下載到了想要的內容
    if (res.statusCode === 200) {
      wx.saveImageToPhotosAlbum({
        filePath: res.tempFilePath,
        success(res) {
          wx.showToast({
            title: '儲存圖片成功!',
          })
        },
        fail(res) {
          wx.showToast({
            title: '儲存圖片失敗!',
          })
        }
      })
    }
  }
})

downloadFile只可以獲取網路上的圖片資源;而getImageInfo則是全能型別,不管是網路上的圖片資源,還是小程式中儲存的圖片。

官方上的說法:getImageInfo的src引數的圖片路徑可以是相對路徑、臨時檔案路徑、儲存檔案路徑(即上面說的全路徑)、網路圖片路徑。

wx.downloadFile({
  url: 'https://example.com/audio/123',     //僅為示例,並非真實的資源
  success: function (res) {
    // 只要伺服器有響應資料,就會把響應內容寫入檔案並進入 success 回撥,業務需要自行判斷是否下載到了想要的內容
    if (res.statusCode === 200) {
      wx.saveImageToPhotosAlbum({
        filePath: res.tempFilePath,
        success(res) {
          wx.showToast({
            title: '儲存圖片成功!',
          })
        },
        fail(res) {
          wx.showToast({
            title: '儲存圖片失敗!',
          })
        }
      })
    }
  }
})

總結:wx.getImageInfo功能更加強大;但是downloadFile則更加專業,因為downloadFile可以讀取下載進度等功能。