How do I create additional buckets in Firebase Cloud Storage Emulator

Question

I am trying to create additional storage buckets in the new Firebase Cloud Storage Emulator. I see no option in the EmulatorUI and have found no resources online. Is this even possible?

Allenaallenby

Answer 1

You can create buckets in the Firebase emulator by following these steps:

1 Setup deploy targets for storage.

firebase target:apply storage default myproject.appspot.com 
firebase target:apply storage other other.appspot.com

2 Configure the firebase.json file

Change the storage section to an array that looks like this:

{
  "storage": [
    {
      "target": "default",
      "rules": "storage.default.rules"
    },
    {
      "target": "other",
      "rules": "storage.other.rules"
    }
  ]
}

Note that the bucket won't be created on the emulator suite until you write something to it. Also you need to change your project to the blaze plan to configure multiple buckets on the firebase console.

This URL has more details on the configuration:

https://firebase.google.com/docs/cli/targets#set-up-deploy-target-storage-database

This documentation page also has information on how to handle multiple buckets with the sdk:

https://firebase.google.com/docs/storage/web/start#use_multiple_storage_buckets

Salley

Answer 2

Hopefully this helps anyone who maybe has a similar issue: very important, on the client side, declare only once your storage buckets and then import them in every other file where they are needed. So, in the file where you declare the storage buckets, it should look something like this:

const mainStorageBucket = getStorage(firebase, "gs://yourAppName.appspot.com");
const additionalStorageBucket = getStorage(firebase, "gs://additionalBucket");
.... // some more code //
export { mainStorageBucket, additionalStorageBucket, ... };

In your app entry point run connectStorageEmulator on your additional storage bucket. The code should look something like this:

import { additionalStorageBucket } from "file_location/to_your/buckets"
connectStorageEmulator(additionalStorageBucket, "localhost", 9199);

Anytime you need to run operations on the storage buckets import them from where you originally declared them. Do not make multiple declarations in multiple files, i.e. your code should invoke getStorage only once for every bucket (on the client side). Note that your additional storage bucket may not show up in the emulator suite (i.e. localhost:4000) until you actually write something to it.

Topnotch