Create a Storage Reference on Web

Your files are stored in a
Google Cloud Storage bucket. The files in
this bucket are presented in a hierarchical structure, just like the file system
on your local hard disk, or the data in the Firebase Realtime Database. By creating
a reference to a file, your app gains access to it. These references can then be
used to upload or download data, get or update metadata or delete the file. A
reference can either point to a specific file or to a higher level node in
the hierarchy.

If you've used the Firebase Realtime Database,
these paths may seem very familiar to you—they should! However, your file
data is stored in Google Cloud Storage,
not in the Realtime Database.

Create a Reference

In order to upload or download files, delete files, or get or update metadata,
you must create a reference to the file you want to operate on. A reference
can be thought of as a pointer to a file in the cloud. References are
lightweight, so you can create as many as you need, and they are also reusable for
multiple operations.

Create references from the storage() service in your Firebase app.
This reference points to the root of your Cloud Storage bucket.

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

You can create a reference to a location lower in the tree,
say 'images/space.jpg' by using the child() method on an existing reference.

Navigate with References

You can also use the parent and root properties to navigate up the
file hierarchy. parent navigates up one level,
while root navigates all the way to the top.

// 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, and root can be chained together multiple times, as
each returns a reference. The exception is the parent of root, which
is null.

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

Reference Properties

You can inspect references to better understand the files they point to
using the fullPath, name, and bucket properties. These properties
get the full path of the file, the name of the file,
and the bucket the file is stored in.

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

Limitations on References

Reference paths and names can contain any sequence of valid Unicode characters,
but certain restrictions are imposed including:

Total length of reference.fullPath must be between 1 and 1024 bytes when UTF-8 encoded.