React Native: which firebase storage npm package to use?

Question

A learner in React native and Firebase.

Here is my code to intialize firebase storage and fetch url for a storage path:

import { firebase } from '@react-native-firebase/storage';

var firebaseConfig = {
    apiKey: "...",
    authDomain: "...",
    databaseURL: "...",
    projectId: "...",
    storageBucket: "...",
    messagingSenderId: "...",
    appId: "...",
    measurementId: "..."
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);


  const storage = firebase.storage();

  let imageRef = firebase.storage().ref('photos/flower.png');
  console.log(imageRef);

I expect imageRef to be containing url for the Firebase storage's image file.

But I get the error:

ERROR TypeError: undefined is not an object (evaluating '_firebase.firebase.storage')

I feel, the error is due to wrong package name import.

Could someone guide me on what is wrong?

Doug Stevenson Doug Stevenson · Accepted Answer · 2020-10-11T17:24:27

I expect imageRef to be containing url for the Firebase storage's image file.

Firstly, you should follow the example in the documentation.

The core documentation also says:

Unlike the Firebase Web SDK, there is no need to manually call the initializeApp method with your project credentials.

So you shouldn't have to call initializeApp at all if you set things up correctly.

ref() returns a Reference type object, which is just a pointer to the file. If you want an HTTPS type URL to download the content of that file, you will need to use its getDownloadURL method to get that.

import storage from '@react-native-firebase/storage';

let imageRef = storage().ref('photos/flower.png');
imageRef.getDownloadURL().then(url => {
    console.log(url);
})

React Native: which firebase storage npm package to use?

1 Answers