在網路上建立 Cloud Storage 參考資料

檔案會儲存在 Cloud Storage bucket。這個 bucket 中的檔案會以階層結構呈現，就像本機硬碟上的檔案系統，或 Firebase Realtime Database 中的資料。建立檔案參照後，應用程式就能存取該檔案。這些參照可用於上傳或下載資料、取得或更新中繼資料，或刪除檔案。參照可以指向特定檔案，也可以指向階層中較高層級的節點。

如果您曾使用 Firebase Realtime Database，應該對這些路徑非常熟悉。不過，檔案資料會儲存在 Cloud Storage，而「不」儲存在 Realtime Database。

可建立參照

如要上傳、下載或刪除檔案，或取得/更新中繼資料，您必須建立要操作的檔案參照。參照可以視為指向雲端檔案的指標。參照是輕量級的，因此您可以視需要建立多個參照，也可以在多個作業中重複使用。

如要建立參照，請使用 getStorage() 取得 Storage 服務的執行個體，然後呼叫 ref()，並將服務做為引數。這個參照指向 Cloud Storage bucket 的根目錄。

Web

import { getStorage, ref } from "firebase/storage";

// Get a reference to the storage service, which is used to create references in your storage bucket
const storage = getStorage();

// Create a storage reference from our storage service
const storageRef = ref(storage);

Web

// Get a reference to the storage service, which is used to create references in your storage bucket
var storage = firebase.storage();

// Create a storage reference from our storage service
var storageRef = storage.ref();

您可以在呼叫 ref() 時，將這個路徑做為第二個引數傳入，藉此建立樹狀結構中較低位置 (例如 'images/space.jpg') 的參照。

Web

import { getStorage, ref } from "firebase/storage";

const storage = getStorage();

// Create a child reference
const imagesRef = ref(storage, 'images');
// imagesRef now points to 'images'

// Child references can also take paths delimited by '/'
const spaceRef = ref(storage, 'images/space.jpg');
// spaceRef now points to "images/space.jpg"
// imagesRef still points to "images"

Web

// Create a child reference
var imagesRef = storageRef.child('images');
// imagesRef now points to 'images'

// Child references can also take paths delimited by '/'
var spaceRef = storageRef.child('images/space.jpg');
// spaceRef now points to "images/space.jpg"
// imagesRef still points to "images"

您也可以使用 parent 和 root 屬性，在檔案階層中向上瀏覽。parent 會向上瀏覽一個層級，而 root 則會一路向上瀏覽至頂層。

Web

import { getStorage, ref } from "firebase/storage";

const storage = getStorage();
const spaceRef = ref(storage, 'images/space.jpg');

// Parent allows us to move to the parent of a reference
const imagesRef = spaceRef.parent;
// imagesRef now points to 'images'

// Root allows us to move all the way back to the top of our bucket
const rootRef = spaceRef.root;
// rootRef now points to the root

Web

// Parent allows us to move to the parent of a reference
var imagesRef = spaceRef.parent;
// imagesRef now points to 'images'

// Root allows us to move all the way back to the top of our bucket
var rootRef = spaceRef.root;
// rootRef now points to the root

child()、parent 和 root 可多次鏈結在一起，因為每個方法都會傳回參照。例外狀況是 root 的 parent，即 null。

Web

import { getStorage, ref } from "firebase/storage";

const storage = getStorage();
const spaceRef = ref(storage, 'images/space.jpg');

// References can be chained together multiple times
const earthRef = ref(spaceRef.parent, 'earth.jpg');
// earthRef points to 'images/earth.jpg'

// nullRef is null, since the parent of root is null
const nullRef = spaceRef.root.parent;

Web

// References can be chained together multiple times
var earthRef = spaceRef.parent.child('earth.jpg');
// earthRef points to 'images/earth.jpg'

// nullRef is null, since the parent of root is null
var nullRef = spaceRef.root.parent;

參考屬性

您可以使用 fullPath、name 和 bucket 屬性檢查參照，進一步瞭解參照指向的檔案。這些屬性會取得檔案的完整路徑、檔案名稱，以及儲存檔案的 bucket。

Web

import { getStorage, ref } from "firebase/storage";

const storage = getStorage();
const spaceRef = ref(storage, 'images/space.jpg');

// Reference's path is: 'images/space.jpg'
// This is analogous to a file path on disk
spaceRef.fullPath;

// Reference's name is the last segment of the full path: 'space.jpg'
// This is analogous to the file name
spaceRef.name;

// Reference's bucket is the name of the storage bucket where files are stored
spaceRef.bucket;

Web

// Reference's path is: 'images/space.jpg'
// This is analogous to a file path on disk
spaceRef.fullPath;

// Reference's name is the last segment of the full path: 'space.jpg'
// This is analogous to the file name
spaceRef.name;

// Reference's bucket is the name of the storage bucket where files are stored
spaceRef.bucket;

參考檔案限制

參照路徑和名稱可包含任何有效的 Unicode 字元序列，但須遵守特定限制，包括：

  1. reference.fullPath的總長度必須介於 1 至 1024 個位元組 (採用 UTF-8 編碼)。
  2. 不含回車字元或換行字元。
  3. 請避免使用 #、[、]、* 或 ?，因為這些工具與 Firebase Realtime Database 或 gsutil 等其他工具搭配使用時，效果不佳。

完整範例

Web

import { getStorage, ref } from "firebase/storage";

const storage = getStorage();

// Points to the root reference
const storageRef = ref(storage);

// Points to 'images'
const imagesRef = ref(storageRef, 'images');

// Points to 'images/space.jpg'
// Note that you can use variables to create child values
const fileName = 'space.jpg';
const spaceRef = ref(imagesRef, fileName);

// File path is 'images/space.jpg'
const path = spaceRef.fullPath;

// File name is 'space.jpg'
const name = spaceRef.name;

// Points to 'images'
const imagesRefAgain = spaceRef.parent;

Web

// Points to the root reference
var storageRef = firebase.storage().ref();

// Points to 'images'
var imagesRef = storageRef.child('images');

// Points to 'images/space.jpg'
// Note that you can use variables to create child values
var fileName = 'space.jpg';
var spaceRef = imagesRef.child(fileName);

// File path is 'images/space.jpg'
var path = spaceRef.fullPath;

// File name is 'space.jpg'
var name = spaceRef.name;

// Points to 'images'
var imagesRef = spaceRef.parent;

接下來，我們將說明如何將檔案上傳至 Cloud Storage。