загрузить задачу getDownloadUrl () после завершения - PullRequest
Новая
       112

загрузить задачу getDownloadUrl () после завершения

0 голосов
/ 02 августа 2020

Мне нужен этот служебный метод общего назначения, который принимает объект файла и возвращает мне URL-адрес файла после загрузки, но каким-то образом я получаю обещание вместо URL-адреса загрузки.

Я перепробовал все подошел, мне нужен раствор ES6 async/await. 

export const uploadFile = (file) => {
  let uploadTask = storage.ref(`products/${Date.now()}.${file.name.split('.').pop()}`).put(file);
  uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED, {
    'complete': () => {
      uploadTask.snapshot.ref.getDownloadURL().then((d) => {
        return d
      })
    }
  });
}

Ответы [ 2 ]

2 голосов
/ 02 августа 2020

Как объяснено в do c, если вы вызовете then() на UploadTask, вы получите объект, который «ведет себя как Promise и разрешается с помощью данных моментального снимка, когда загрузка завершена ".

Поэтому следующее должно помочь. 

export const uploadFile = (file) => {
  let uploadTask = storage.ref(`products/${Date.now()}.${file.name.split('.').pop()}`).put(file);
  return uploadTask.
    then(snapshot => {
      return snapshot.ref.getDownloadURL();
    })
    .then((url) => {
      return url
    });
}

Обновите после вашего комментария:

Вы упоминаете в комментариях, что вызываете функцию следующим образом: 

let files = state.images; 
for (let i = 0; i < e.target.files.length; i++) { 
   files = files.concat(e.target.files[i]); 
   let url = uploadFile(files[i])
   console.log(url)
}

Однако функция uploadFile() асинхронный и действительно, как следствие, возвращает Promise. Вы должны принять это во внимание при вызове. Например, используя al oop, вы можете назвать его следующим образом: 

const promises = [];
let files = state.images; 
for (let i = 0; i < e.target.files.length; i++) { 
   files = files.concat(e.target.files[i]); 
   promises.push(uploadFile(files[i]));
}
Promise.all(promises)
 .then(urlsArray => {
    urlsArray.forEach(url => {
        console.log(url);
    })
  })
0 голосов
/ 04 августа 2020

ES6 asyn c ожидание решения для других, имеющих аналогичную проблему: 

export const uploadFile = async (file) => {
  let uploadTask = storage.ref(`products/${Date.now()}.${file.name.split('.').pop()}`).put(file);
  const snapshot = await uploadTask;
  const url = await snapshot.ref.getDownloadURL();
  return url;
}
...