ファイルは Cloud Storage バケットに保存されます。このバケット内のファイルは、ローカル ハードディスク上のファイル システムや Firebase Realtime Database 内のデータと同様の階層構造で表されます。アプリからファイルにアクセスするには、そのファイルへの参照を作成します。作成した参照を使うと、データのアップロードやダウンロード、メタデータの取得や更新、ファイルの削除などを行うことができます。参照は特定のファイルまたは階層内の上位ノードをポイントします。
Firebase Realtime Database を使用したことがある場合は、これらのパスになじみがあると思いますが、ファイルデータの格納場所は Realtime Database ではなく Cloud Storage になります。
参照を作成する
ファイルをアップロード、ダウンロード、または削除したり、メタデータを取得または更新したりするには、操作を行うファイルへの参照を作成する必要があります。参照はクラウド内のファイルへのポインタと考えることができます。参照は軽量なので、必要な数をいくつでも作成でき、複数の操作で再利用することもできます。
参照を作成するには、getStorage()
を使用して Storage サービスのインスタンスを取得します。次に、このサービスを引数に指定して ref()
を呼び出します。この参照は、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);
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();
ツリーの下位(例: 'images/space.jpg'
)への参照を作成できます。これを行うには、ref()
を呼び出すときに、このパスを 2 番目の引数として渡します。
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
は 1 つ上のレベルに移動し、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
プロパティを使用して参照を調べ、参照がポイントしているファイルの詳細を知ることができます。これらのプロパティは、ファイルのフルパス、ファイル名、ファイルが格納されているバケットを取得します。
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 文字を任意の順序で含めることができますが、次のような一定の制約があります。
- UTF-8 でエンコードする場合、
reference.fullPath
の全体の長さを 1~1,024 バイトにする必要があります。 - 改行またはラインフィード文字は使用できません。
#
、[
、]
、*
、?
は使用しないでください。これらの文字は、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 にファイルをアップロードする方法を学習しましょう。