getDownloadURLが正常に動作しない - Firebase Storage（Web）

Question

次のコードは、アップロードされているファイルのダウンロードURLを記録していないようで、次のエラーが表示されます。 {ダウンロードURLではないURL}

GET ... ...これは私のコードは404（）

です。

 //Get image 
    var file = a.target.files[0]; 

    //create a storage reference 
    var storageRef = firebase.storage().ref('images/' + file.name); 

    //store the image 
    var task = storageRef.put(file); 

    var storage = firebase.storage(); 
    storageRef.child('images/'+file.name).getDownloadURL().then(function(url) { 
     console.log(url);   
     }).catch(function(error) { 
     // Handle any errors 
     }); 

どうすればdownloadURLを取得できますか？

Answer 1

ファイルのアップロードは非同期操作であり、完了するまでに時間がかかる場合があります。あなたのコードはそれを処理していないので、ファイルがまだアップロードを完了していないときにダウンロードURLを取得しています。 documentation for uploading files to Firebase Storageから

は、この例が来る：アップロードが完了した後に

// File or Blob, assume the file is called rivers.jpg 
var file = ... 

// Upload the file to the path 'images/rivers.jpg' 
// We can use the 'name' property on the File API to get our file name 
var uploadTask = storageRef.child('images/' + file.name).put(file); 

// Register three observers: 
// 1. 'state_changed' observer, called any time the state changes 
// 2. Error observer, called on failure 
// 3. Completion observer, called on successful completion 
uploadTask.on('state_changed', function(snapshot){ 
    // Observe state change events such as progress, pause, and resume 
    // See below for more detail 
}, function(error) { 
    // Handle unsuccessful uploads 
}, function() { 
    // Handle successful uploads on complete 
    // For instance, get the download URL: https://firebasestorage.googleapis.com/... 
    var downloadURL = uploadTask.snapshot.downloadURL; 
}); 

あなたは、この例では、ダウンロードURLを取得していることがわかります。

あなたが進歩し、失敗を気にしないなら、それはのように簡単になります

uploadTask.on('state_changed', null, null, function() { 
    var downloadURL = uploadTask.snapshot.downloadURL; 
});