React × firebaseで画像をStorageに保存しdownloadUrlを取得したい

Question

前提・実現したいこと

firebaseを用いたアプリケーションで画像をStorageに保存した後、
そのdownloadUrlを取得したいです。
https://firebase.google.com/docs/storage/web/upload-files?hl=ja
↑の「アップロードの進捗状況をモニタリングする」を参照しています。

発生している問題・エラーメッセージ

関数の返り値としてdownloadUrlが取得できず、Promiseが帰ってくる。

該当のソースコード

export const saveImages = async (
  name: string,
  file: any,
)　=> {
  let storage = firebase.storage()
  let imageUrl;
  const storageRef = storage.ref()
  const uploadTask = storageRef.child(`images/${name}`).put(file)
    uploadTask.on(
      'state_changed',
      (snapshot) => {
        console.log('snapshot', snapshot)
      },
      (error) => {
        console.log('err', error)
      },
      () => {
        uploadTask.snapshot.ref.getDownloadURL().then(function(downloadURL) {
          imageUrl = downloadURL;
        })
      }
    )
  return imageUrl;
  // ↑のreturnでURLを返すようにしたいイメージです。 
};

// 戻り先
let downloadUrl = saveImages(fileName, file);
console.log(downloadUrl); // https://image_url....

よろしくお願いいたします。

Answer 1

以下のようにして解決しました。

export const saveImages = async (
  name: string,
  file: any,
)　=> {
  let storage = firebase.storage()
  let imageUrl;
  const storageRef = storage.ref()
  const uploadTask = storageRef.child(`images/${name}`).put(file)
  return uploadTask;
};

const saveItems = async () => {
    let url = '';
    const savedImage = await saveReportImages(imageFileName, imageFile)
    await savedImage.task.snapshot.ref.getDownloadURL().then(function(downloadURL) {
       url = downloadURL
    })
}