Tworzenie referencji Cloud Storage w przeglądarce

Twoje pliki są przechowywane w zasobniku Cloud Storage. Pliki w tym zasobniku są prezentowane w strukturze hierarchicznej, podobnie jak system plików na lokalnym dysku twardym lub dane w Firebase Realtime Database. Gdy utworzysz odwołanie do pliku, Twoja aplikacja uzyska do niego dostęp. Te odwołania można następnie wykorzystać do przesyłania i pobierania danych, uzyskiwania i aktualizowania metadanych oraz usuwania plików. Odwołanie może wskazywać konkretny plik lub węzeł wyższego poziomu w hierarchii.

Jeśli korzystasz z Firebase Realtime Database, te ścieżki powinny być Ci dobrze znane. Dane plików są jednak przechowywane w Cloud Storage, a nie w Realtime Database.

Tworzenie referencji

Aby przesyłać i pobierać pliki, usuwać pliki oraz pobierać i aktualizować metadane, musisz utworzyć odniesienie do pliku, na którym chcesz wykonać operację. Referencję można traktować jako wskaźnik do pliku w chmurze. Odwołania są lekkie, więc możesz utworzyć ich tyle, ile potrzebujesz. Można ich też używać w wielu operacjach.

Aby utworzyć odwołanie, uzyskaj instancję usługi Storage za pomocą funkcji getStorage(), a następnie wywołaj funkcję ref(), przekazując usługę jako argument. Ten odnośnik wskazuje katalog główny Twojego kosza Cloud Storage.

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);
storage_create_ref.js

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();
create-reference.js

Możesz utworzyć odwołanie do lokalizacji znajdującej się niżej w drzewie, np. 'images/space.jpg', przekazując tę ścieżkę jako drugi argument podczas wywoływania funkcji ref().

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"
storage_create_ref_child.js

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"
create-reference.js

Możesz też użyć właściwości parent i root, aby przejść wyżej w hierarchii plików. parent przenosi o 1 poziom wyżej, a root przenosi na samą górę.

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
storage_navigate_ref.js

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
create-reference.js

Funkcje child(), parent i root można łączyć ze sobą wielokrotnie, ponieważ każda z nich zwraca odwołanie. Wyjątkiem jest parent root, który wynosi 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;
storage_navigate_ref_chain.js

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;
create-reference.js

Właściwości referencyjne

Możesz sprawdzić odwołania, aby lepiej zrozumieć, do jakich plików się odnoszą, za pomocą właściwości fullPath, name i bucket. Te właściwości pobierają pełną ścieżkę pliku, jego nazwę i zasobnik, w którym jest on przechowywany.

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;
storage_ref_properties.js

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;
create-reference.js

Ograniczenia dotyczące odwołań

Ścieżki i nazwy referencji mogą zawierać dowolną sekwencję prawidłowych znaków Unicode, ale obowiązują pewne ograniczenia, m.in.:

  1. Łączna długość pola reference.fullPath musi wynosić od 1 do 1024 bajtów po zakodowaniu w formacie UTF-8.
  2. Nie używaj znaków powrotu karetki ani znaku nowego wiersza.
  3. Unikaj używania znaków #, [, ], * i ?, ponieważ nie działają one prawidłowo z innymi narzędziami, takimi jak Firebase Realtime Database czy gsutil.

Pełny przykład

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;
storage_ref_full_example.js

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;
create-reference.js

Teraz dowiesz się, jak przesyłać pliki do Cloud Storage.