Redux Firebase Upload File-Objekt

Question

Versuchen, das Dateiobjekt zu reduktiven Aktion übergeben und führen Sie die Funktion innerhalb einer Redux-Aktion, nicht sicher, es ist der richtige Weg? aber im Grunde möchte ich zurück DownloadURL von Firebase Upload abgeschlossen, so dass ich Bild Frontend zeigen kann.

createLocation(event) { 
    event.preventDefault(); 
    const fileObject = this.state.file; 

    const test = { 
     fileObject 
    } 

    this.props.uploadImage_func(test); 
} 

und Action-Funktion:

export function uploadImage_func(fileObject) { 
    return dispatch => { 
     const fileName = 'myimage'; 
     const storageRef = firebase.storage().ref('test/' + fileName); 
     const task = storageRef.put(fileObject); 

     task.on('state_changed', 
      function complete(snapshot) { 
       const downloadURL = task.snapshot.downloadURL; 
      }, 
     ).then(function() { 

      dispatch(attemptLogin({ 
       ...downloadURL 
      })); 

     }); 
    } 
} 

Fehler:

Answer 1

Wie Sie einen Fehler bekommen haben sehen können Invalid argument in 'put' at index 0: Expected Blob or File. Also zuerst brauchst du Pfad genau File oder Blob. Wenn Sie richtig in Ihnen createLocation gemacht haben und Dateiobjekt erhalten haben, dann müssen Sie es nicht in const test Objekt mehr wickeln. Diese Aktion verursacht unnötige Verschachtelung, also nur Pfad fileObject wie es ist. Und mehr. Wenn Sie Feuerbasis UploadTask on Ereignis zu abonnieren benötigen Sie für Callback-Funktionen auf Pfad und tun es in einer richtigen Reihenfolge, so versuchen Sie neben verwenden:

uploadTask.on('state_changed', 
    (snapshot) => { 
    // here you could log loading information in percents but uploading is not finished yes 
    console.log((snapshot.bytesTransferred/snapshot.totalBytes) * 100); 
    }, 
    (error) => console.log(error), 
() => { 
    // And after uploading is complete you could get your download url 
    console.log('Call save img', uploadTask.snapshot.downloadURL); 
    } 
); 

Für weitere Informationen lesen documentation for Firebase Storage (Upload files)