在 Web 上創建 Cloud Storage 參考

您的文件存儲在雲存儲桶。此存儲分區中的文件以分層結構呈現,就像本地硬盤上的文件系統或 Firebase 實時數據庫中的數據一樣。通過創建對文件的引用,您的應用程序可以訪問它。然後可以使用這些引用來上傳或下載數據、獲取或更新元數據或刪除文件。引用可以指向特定文件或層次結構中的更高級別節點。

如果您已經使用了火力地堡實時數據庫,這些路徑應該在你看來很熟悉。然而,你的文件數據存儲在雲存儲,而不是在實時數據庫。

創建參考

為了上傳或下載文件、刪除文件或獲取或更新元數據,您必須創建對要操作的文件的引用。可以將引用視為指向雲中文件的指針。引用是輕量級的,因此您可以根據需要創建任意數量的引用,並且它們也可重用於多個操作。

創建從引用storage()在你的火力地堡的應用服務。此引用指向 Cloud Storage 存儲分區的根。

網頁版 9

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);

網頁版 8

// 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();

您可以在樹中創建一個位置的參考下,說'images/space.jpg'使用child()方法對現有的參考。

網頁版 9

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"

網頁版 8

// 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"

您也可以使用parentroot屬性瀏覽了該文件的層次結構。 parent向上導航一個級別,而root瀏覽所有的方式達到頂峰。

網頁版 9

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

網頁版 8

// 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可以多次鏈接在一起,因為每一個返回的參考。唯一的例外是parentroot ,這是null

網頁版 9

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;

網頁版 8

// 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;

參考屬性

您可以檢查引用,以更好地它們指向的文件,了解使用fullPathnamebucket性。這些屬性獲取文件的完整路徑、文件名以及存儲文件的存儲桶。

網頁版 9

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;

網頁版 8

// 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. 避免使用#[]*? ,因為這些不與其他工具,如很好地工作火力地堡實時數據庫gsutil會

完整示例

網頁版 9

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;

網頁版 8

// 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;

接下來,讓我們學習如何上傳文件到雲存儲。