Firebase Storage in Emulator: refFromUrl() expected a valid full URL

Question

Is it possible refFromURL() is not working in local?

  function deleteImage(imageUrl: string) {
    let urlRef = firebase.storage().refFromURL(imageUrl)
    return urlRef.delete().catch((error) => console.error(error))
  }

When passing the following url:

http://localhost:9199/v0/b/xxx.appspot.com/o/images%2Fdemo%2FHWEGgAPDSZrtMzbil2MwM.image%2Fjpeg?alt=media&token=a7f798ee-056a-4f03-a7bf-8453b71077e6

I get the following error:

Uncaught FirebaseError: Firebase Storage: refFromUrl() expected a valid full URL but got an invalid one. (storage/invalid-argument)

score 1 · Answer 1 · answered Sep 17 '21 at 01:19

I also encountered this problem, and wasn't able to find a proper solution.

I ended up getting around it by implementing a check in my app to see if the url contains "localhost:9199", if it does then it should just be provided as is. If it doesn't, that means the code is being used in a production environment and needs to be unpacked using refFromUrl().

This is just a workaround rather than a proper fix. Hopefully someone else out there will help us out!

export default async function getPostInfo(id) {
  const ref = firestore.collection("posts").doc(id);
  const doc = await ref.get();
  const imgRef = doc.data().image;
  // To handle firebase storage emulator. .refFromURL() doesn't work with locally stored files in the emulator.
  let image;
  const regex = new RegExp(/localhost:9199/);
  if (!regex.test(imgRef)) {
    image = await storage.refFromURL(imgRef).getDownloadURL();
  } else {
    image = doc.data().image;
  }

  return { ...doc.data(), image, id: doc.id };
}

score 0 · Accepted Answer · answered Jun 14 '22 at 21:53

For future googlers, this is a known issue that was fixed in Firebase SDK 9.0.2. See the issue for details, but as far as I can tell, the problem had to do with the URL parser not liking http links. Normally this is fine, but the local emulator runs on localhost, and localhost will be http for the foreseeable future.

$ npm i firebase@9.0.2

# or

$ npm i firebase@latest

Note: If you're coming from version 8.x.x or lower, there are some breaking changes. Lucky for us, there is a "compat" API that should keep your immediate code changes minimal. Here's a migration guide for you.

Firebase Storage in Emulator: refFromUrl() expected a valid full URL

2 Answers2