Firebase Storage: To use ref(service, url), the first argument must be a Storage instance-CodePudding

I'm having trouble retrieving images from firebase storage. I'm currently integrating the Firebase SDK in my expo react native project. Firebase's sdk version I'm using is 9.6.1. I can successfully use Firebase AUTH and firebase firestore (retrieving and updating data).

When I try to use firebase's storage I get this weird error:

[Unhandled promise rejection: FirebaseError: Firebase Storage: To use ref(service, url), the first argument must be a Storage instance. (storage/invalid-argument)]

This is where I initialise my firebase app:

import { initializeApp } from "firebase/app";

export const firebaseConfig = {
  apiKey: "apices",
  authDomain: "xxxxx.firebaseapp.com",
  databaseURL:
    "https://xxxxx-default-rtdb.europe-west1.firebasedatabase.app",
  projectId: "xxxxx",
  storageBucket: "xxxxx.appspot.com",
  messagingSenderId: "333333333",
  appId: "yyyyyyyyyyy",
  measurementId: "fffffff",
};

const app = initializeApp(firebaseConfig);

export { app };

Then doing a simple:

const imageRef = ref(getStorage(), imageUrl);

gives me an error. And yes imageUrl is a valid gs://projectid.appspot.com/folder1/image1.jpg url.

Am I getting something wrong?

CodePudding user response：

Can you try initializing storage in the same file where you've initialized Firebase and then import it wherever required? The getStorage() currently might be getting invoked before Firebase is initialized:

const app = initializeApp(firebaseConfig);
const storage = getStorage(app)l

export { app, storage };

// import { storage } from "../firebase_file.js"

const imageRef = ref(storage, imageUrl);