Issue

This Content is from Stack Overflow. Question asked by Frallen

I have an application on vue 3. I need to get a link to a document from the repository. At the moment, I always get a promise, which is how it should be. But I should get a link to the document, but it doesn’t. Why is this happening?

 async FetchData({ state, commit }, to) {
      try {
        commit("setLoading", true);
        const q = query(collection(db, to));

        await onSnapshot(q, (querySnapshot) => {
          const data = [];

          querySnapshot.forEach((doc) => {
            let  films = async(to) => {
              const starsRef = ref(storage, `images/${doc.id}/poster.png`);

              return await getDownloadURL(starsRef);
            };

            // const poster=`gs://cell-11ef4.appspot.com/images/${doc.id}/poster.png`

            let item = {
              id: doc.id,
              name: doc.data().name,
              slug: doc.data().slug,
              country: doc.data().country,
              duration: doc.data().duration,
              year: doc.data().year,
              video: doc.data().video,
              genres: doc.data().genres,
              actors: doc.data().actors,
              poster: to === "films" ? films() : null,
              // BipPoster: url,
            };

            data.push(item);

            // Get the download URL
          });

          commit("setData", { data, to });
        });
      } catch (err) {
        console.log(err);
      } finally {
        commit("setLoading", false);
      }
    },

What i get

Solution

You should use Promise.all() as follows:

const promises = [];
querySnapshot.forEach((doc) => {
     const starsRef = ref(storage, `images/${doc.id}/poster.png`);

     promises.push(getDownloadURL(starsRef));
});

const urlsArray = await Promise.all(promises);

This Question was asked in StackOverflow by Frallen and Answered by Renaud Tarnec It is licensed under the terms of CC BY-SA 2.5. - CC BY-SA 3.0. - CC BY-SA 4.0.