Jak przesłać wiele plików do Firebase?

Question

Czy istnieje sposób przesyłania wielu plików do magazynu Firebase. Może przesłać pojedynczy plik w ciągu jednej próby w następujący sposób.

fileButton.addEventListener('change', function(e){ 
//Get file 
var file = e.target.files[0]; 

//Create storage reference 
var storageRef = firebase.storage().ref(DirectryPath+"/"+file.name); 

//Upload file 
var task = storageRef.put(file); 

//Update progress bar 
    task.on('state_changed', 
    function progress(snapshot){ 

     var percentage = snapshot.bytesTransferred/snapshot.totalBytes * 100; 
     uploader.value = percentage; 
    }, 
    function error(err){ 

    }, 
    function complete(){ 
     var downloadURL = task.snapshot.downloadURL; 

    } 
); 

}); 

Jak przesłać wiele plików do magazynu Firebase.

Answer 1

Znalazłem rozwiązanie dla mojego pytania powyżej i lubię je tutaj umieścić, ponieważ może być przydatne dla każdego.

//Listen for file selection 
fileButton.addEventListener('change', function(e){ 
    //Get files 
    for (var i = 0; i < e.target.files.length; i++) { 
     var imageFile = e.target.files[i]; 

     uploadImageAsPromise(imageFile); 
    } 
}); 

//Handle waiting to upload each file using promise 
function uploadImageAsPromise (imageFile) { 
    return new Promise(function (resolve, reject) { 
     var storageRef = firebase.storage().ref(fullDirectory+"/"+imageFile.name); 

     //Upload file 
     var task = storageRef.put(imageFile); 

     //Update progress bar 
     task.on('state_changed', 
      function progress(snapshot){ 
       var percentage = snapshot.bytesTransferred/snapshot.totalBytes * 100; 
       uploader.value = percentage; 
      }, 
      function error(err){ 

      }, 
      function complete(){ 
       var downloadURL = task.snapshot.downloadURL; 
      } 
     ); 
    }); 
} 

Answer 2

wierzę istnieje prostsze rozwiązanie:

// set it up 
firebase.storage().ref().constructor.prototype.putFiles = function(files) { 
    var ref = this; 
    return Promise.all(files.map(function(file) { 
    return ref.child(file.name).put(file); 
    })); 
} 

// use it! 
firebase.storage().ref().putFiles(files).then(function(metadatas) { 
    // Get an array of file metadata 
}).catch(function(error) { 
    // If any task fails, handle this 
}); 

Answer 3

Firebase Storage wykorzystuje obietnicy, więc można użyć Promises, aby go osiągnąć.

Oto Firebase blogu artykuł, który obejmuje ten temat: Keeping our Promises (and Callbacks)

---

Daj Promise.all() "osoba tablicę Promises"

Promise.all(
    // Array of "Promises" 
    myItems.map(item => putStorageItem(item)) 
) 
.then((url) => { 
    console.log(`All success`) 
}) 
.catch((error) => { 
    console.log(`Some failed: `, error.message) 
}); 

Upload każdy plik i powrócić obietnicę

putStorageItem(item) { 
    // the return value will be a Promise 
    return firebase.storage().ref("YourPath").put("YourFile") 
    .then((snapshot) => { 
    console.log('One success:', item) 
    }).catch((error) => { 
    console.log('One failed:', item, error.message) 
    }); 
} 

YourPath i YourFile może być przenoszony z tablicą myItems (a więc obiektem item).

Pominąłem je tutaj tylko dla czytelności, ale masz pojęcie.