Skip to main content
@capgo/capacitor-firebase-storage Files & Storage Open source

Firebase Storage Capacitor plugin

Capacitor plugin for Firebase Cloud Storage

Install

bun add @capgo/capacitor-firebase-storage bunx cap sync
npm, pnpm or yarn
  • npm install @capgo/capacitor-firebase-storage
  • pnpm add @capgo/capacitor-firebase-storage
  • yarn add @capgo/capacitor-firebase-storage

Guide

How to use Firebase Storage in Capacitor

Using @capgo/capacitor-firebase-storage

Capacitor plugin for Firebase Cloud Storage.

Install

bun add @capgo/capacitor-firebase-storage
bunx cap sync

bunx cap sync copies the plugin's native code into your native projects. Run it again after every plugin upgrade.

Import

import { FirebaseStorage } from '@capgo/capacitor-firebase-storage';

API at a glance

Method Description
deleteFile Delete a file.
getDownloadUrl Get the download url for a file.
getMetadata Get the metadata for a file.
listFiles List files in a directory.
updateMetadata Update the metadata for a file.
downloadFile Download a file.
uploadFile Upload a file.
useEmulator Instrument your app to talk to the Cloud Storage emulator.

Examples

deleteFile()

Delete a file.

import { FirebaseStorage } from '@capgo/capacitor-firebase-storage';

await FirebaseStorage.deleteFile({ path: 'mountains.png' });

getDownloadUrl()

Get the download url for a file.

import { FirebaseStorage } from '@capgo/capacitor-firebase-storage';

const result = await FirebaseStorage.getDownloadUrl({ path: 'mountains.png' });
console.log(result);

getMetadata()

Get the metadata for a file.

import { FirebaseStorage } from '@capgo/capacitor-firebase-storage';

const result = await FirebaseStorage.getMetadata({ path: 'mountains.png' });
console.log(result);

listFiles()

List files in a directory.

import { FirebaseStorage } from '@capgo/capacitor-firebase-storage';

const result = await FirebaseStorage.listFiles({ path: 'path/to/file' });
// The result holds sensitive values: use it without logging it.

updateMetadata()

Update the metadata for a file.

import { FirebaseStorage } from '@capgo/capacitor-firebase-storage';

await FirebaseStorage.updateMetadata({
  path: 'path/to/file',
  metadata: {},
});

downloadFile()

Download a file.

import { FirebaseStorage } from '@capgo/capacitor-firebase-storage';

const result = await FirebaseStorage.downloadFile({ path: 'mountains.png' }, (event, error) => {
  console.log(event);
});
console.log(result);

The table above lists the 8 core methods. Listener and version helpers, and the full contract of each method, are documented in the GitHub repository.

Full reference

Keep going from Using @capgo/capacitor-firebase-storage

If you are using Using @capgo/capacitor-firebase-storage to plan storage and file handling, connect it with @capgo/capacitor-data-storage-sqlite for the implementation detail in @capgo/capacitor-data-storage-sqlite, Using @capgo/capacitor-data-storage-sqlite for the native capability in Using @capgo/capacitor-data-storage-sqlite, @capgo/capacitor-file for the implementation detail in @capgo/capacitor-file, Using @capgo/capacitor-file for the native capability in Using @capgo/capacitor-file, and @capgo/capacitor-uploader for the implementation detail in @capgo/capacitor-uploader.

FAQ

Firebase Storage plugin FAQ

How do I install the Firebase Storage plugin in a Capacitor app?

Run "bun add @capgo/capacitor-firebase-storage" (or "npm install @capgo/capacitor-firebase-storage"), then run "bunx cap sync" so the iOS and Android projects pick up the native code. Import it from "@capgo/capacitor-firebase-storage" in your app code.

Does @capgo/capacitor-firebase-storage work with React, Vue and Angular?

Yes. Firebase Storage is a Capacitor package, so it works with any web framework that runs inside Capacitor, including Ionic, React, Vue, Angular, Svelte and plain JavaScript.

Which Capacitor version does @capgo/capacitor-firebase-storage support?

Capgo plugins follow Capacitor's major version: use the plugin major version that matches your Capacitor major version (for example plugin v8 with Capacitor 8). The compatibility table in the GitHub README lists the maintained versions.

Is @capgo/capacitor-firebase-storage free and open source?

Yes. The source code is public on GitHub at https://github.com/Cap-go/capacitor-firebase/tree/main/packages/storage and the package is free to install from npm. Bug reports and pull requests are welcome.

Can I update code that uses Firebase Storage without an App Store review?

Installing or upgrading the plugin changes native code, so it needs a new store build. After that, JavaScript, HTML and CSS changes that call the plugin can ship instantly with Capgo live updates.

Ship Firebase Storage changes without waiting for app review

Once the plugin is in your store build, Capgo live updates push your JavaScript, HTML and CSS changes to users in minutes.

Start with Capgo