云存儲介紹

云存儲用于將文件存儲到云端:

云存儲提供高可用、高穩(wěn)定、強安全的云端存儲服務(wù);

持任意數(shù)量和形式的非結(jié)構(gòu)化數(shù)據(jù)存儲，如視頻和圖片;

并在控制臺進行可視化管理;

云存儲常見的操作:

上傳文件到云存儲中(圖片、視頻、音頻等等都可以)

獲取文件的臨時鏈接(在外網(wǎng)可以訪問)

下載文件到本地(本地文件緩存)

將云存儲中的文件刪除

手動操作云存儲

和云數(shù)據(jù)庫一樣, 可以手動在控制臺進行操作, 操作步驟如下

例如上傳一個圖片文件到云存儲中, 在控制臺點擊上傳文件, 選擇上傳的文件即可

上傳完成后會有一個唯一的fileID在項目中顯示

根據(jù)這個fileID我們在可以在前端獲取URL, 并展示

<image src="cloud://cloud1-0g75nm8011e44998.636c-cloud1-0g75nm8011e44998-1313411765/勛章電子證書.png"></image>

除了圖片外, 視頻音頻等等都是一樣的操作

小程序端操作云存儲

在真實開發(fā)中, 我們一般不是手動的在控制臺操作云存儲, 更多的是在小程序端操作, 接下來我會講解在小程序端操作云存儲的方法

在小程序端, 我主要講解上傳文件、下載文件、刪除文件、臨時文件, 為了方便演示, 我分別創(chuàng)建四個按鈕, 在這四個按鈕的點擊事件中分別演示小程序端的操作

<button type="primary" bindtap="onUpLoadTap">上傳文件</button>
<button type="primary" bindtap="onDownLoadTap">下載文件</button>
<button type="primary" bindtap="onDeleteTap">刪除文件</button>
<button type="primary" bindtap="onTempFileTap">臨時文件</button>

onUpLoadTap() {},
onDownLoadTap() {},
onDeleteTap() {},
onTempFileTap() {}

上傳文件

**上傳文件通過wx.cloud.uploadFileAPI, 該API要求傳入一個對象 **

filePath屬性表示上傳圖片的路徑

cloudPath屬性表示要上傳到云端文件的名稱, 一般這個名稱是動態(tài)生成的, 并且這個名稱盡量做到不重復(fù); 圖片默認會上傳到云端根目錄, 可以指定文件夾

上傳文件分為以下幾個步驟

首先需要選中本地文件(從相冊/拍照)

獲取到圖片的路徑

將這張圖片上傳到云存儲當(dāng)中

async onUpLoadTap() {
  // 1.選擇一張本地的照片
  const imageRes = await wx.chooseMedia({
    type: "image"
  })
  console.log(imageRes);

  // 2.獲取圖片路徑
  const imagePath = imageRes.tempFiles[0].tempFilePath

  // 3,上傳到云存儲
  // 動態(tài)生成名稱的操作
  const timestamp = new Date().getTime() // 獲取時間戳保證圖片名稱唯一
  const openid = "open_xx " // 獲取openid防止同一時間, 不同的人上傳了相同名稱
  const extension = imagePath.split(".").pop()
  const imageName = `${timestamp}_${openid}.${extension}`
  // 調(diào)用API上傳圖片
  const uploadRes = await wx.cloud.uploadFile({
    filePath: imagePath,
    // 默認上傳到云端根目錄
    cloudPath: imageName
  })
  console.log(uploadRes);
}

指定文件夾上傳

// 調(diào)用API上傳圖片
const uploadRes = await wx.cloud.uploadFile({
  filePath: imagePath,
  // 上傳到指定文件夾
  cloudPath: "image/" + imageName
})

下載文件

如果文件是放在云存儲中，那么必然需要有網(wǎng)絡(luò)的情況下才能訪問。

某些情況下，我們可能希望把某些重要的文件下載到本地，就可以使用云存儲的文件下載了

下載是通過wx.cloud.downloadFileAPI, API中fileID屬性傳入要下載文件的fileID

async onDownLoadTap() {
const res = await wx.cloud.downloadFile({
  fileID: "cloud://cloud1-0g75nm8011e44998.636c-cloud1-0g75nm8011e44998-1313411765/image/1661571031747_open_xx .png"
  })
  console.log(res);
}

刪除文件

某些文件不再使用時，可以將其從云存儲中刪除掉，這樣可以省略空間

刪除是通過wx.cloud.deleteFileAPI, 需要傳入fileList屬性, 表示刪除的集合, 可以刪除一條或者多條

async onDeleteTap() {
// 1.刪除云存儲中的內(nèi)容
const res = await wx.cloud.deleteFile({
  fileList: [
    "cloud://cloud1-0g75nm8011e44998.636c-cloud1-0g75nm8011e44998-1313411765/1661570752252_open_xx .png",
    "cloud://cloud1-0g75nm8011e44998.636c-cloud1-0g75nm8011e44998-1313411765/image/1661571031747_open_xx .png"
  ]
})
  console.log(res);
}

獲取臨時鏈接

為什么要獲取臨時鏈接?

我們將文件上傳到云存儲后，可以通過fileID在小程序中直接訪問;

但是，如果我們希望在小程序以外的地方訪問(比如瀏覽器、手機端)，那么fileID是不可以的;

這個時候，我們可以通過獲取臨時鏈接，該鏈接可以在小程序以外訪問;

獲取臨時鏈接通過wx.cloud.getTempFileURLAPI, 和刪除文件一樣, 可以一次獲取多個文件的臨時鏈接, 因此傳入的屬性是fileList

async onTempFileTap() {
  const res = await wx.cloud.getTempFileURL({
    fileList: [
      "cloud://cloud1-0g75nm8011e44998.636c-cloud1-0g75nm8011e44998-1313411765/image/1661572611027_open_xx .png"
    ]
  })
  console.log(res);
}

注意, 文件鏈接有效期為兩個小時文章來源地址http://www.zghlxwxcb.cn/news/detail-782979.html

到了這里，關(guān)于【云開發(fā)】- 在小程序端操作云存儲的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！