Firebase getDownloadURL von Speicher kann nicht festgelegt werden Img Src

Question

Ich versuche, die Ergebnisse dieser Frage here zu replizieren. Ich bin in der Lage, getDownloadURL() auf einem gültigen Datenbank-Kind aufzurufen, aber das Ergebnis, das es zurückgibt, scheint nicht auf einem IMG src festgelegt werden. Dies ist der Code, den ich zur Zeit die Download-URL, um zu versuchen und greifen bin mit:

var storage = firebase.storage(); 
var storageRef = storage.ref(); 
var imgRef = storageRef.child('profile-pictures/1.jpg'); 
var pulledProfileImage = imgRef.getDownloadURL(); 

ich dann pulledProfileImage in ein Array schieben, indem Sie diese:

dataArray.push(pulledProfileImage) 

das Array senden (zusammen mit anderen Informationen) off zu einer Funktion, die eine Tabelle mit Daten füllt. Das Bild selbst ist referenziert mit diesem Code hier:

cell1.innerHTML = '<img id="profileImage" src="'+dataArray[0]+'">'; 

Wenn ich den Quellcode überprüfen, nachdem der Code ausgeführt wird, wird die src auf [Object, Object]. Ich habe auch das Skript das Ergebnis der Anmeldung, die, wenn es so tut, sieht wie folgt aus:

0:C 
Hc:false 
N:2 
Pa:null 
Wb:false 
ja:null 
na:"https://firebasestorage.googleapis.com/v0/b/app-name-da7a1.appspot.com/..." 
s:null 

Das Merkwürdige ist, wenn ich die Konsole Druck haben sagen eine andere Eigenschaft aus, Wb aus der obigen Liste von console.log(Array[0].Wb) Aufruf es druckt false heraus PERFEKT .... jeder boolean scheint, gerade gut zu sein, gerade keine Schnüre oder Zahlen.

Als Referenz sieht meine Speicherstruktur wie folgt aus:

----root 
    | 
    |------profile-pictures 
      |---------------------- img1.png <--the console is trying to print this one 
      | 
      |---------------------- img2.png 

Und meine Datenbankstruktur, die Namen der Bilder zu finden, ist zu ziehen, etwa so:

----root 
    | 
    |----folder1 
      | 
      | 
      |----subfolder1 
        | 
        | 
        |----subfolder2 
          | 
          | 
          |--------img1.png 
          | 
          |--------img2.png 

Grundsätzlich meinen Code navigiert zu Unterordner zwei, zieht die Kindwerte, geht dann in den Speicher und versucht, sie von dort zu ziehen.

Answer 1

Der Trick dabei ist, dass getDownloadURL ist ein Asynchron-Funktion, die ein Versprechen zurückzukehren geschieht (wie pro the docs):

var storage = firebase.storage(); 
var storageRef = storage.ref(); 
var imgRef = storageRef.child('profile-pictures/1.jpg'); 
// call .then() on the promise returned to get the value 
imgRef.getDownloadURL().then(function(url) { 
    var pulledProfileImage = url; 
    dataArray.push(pulledProfileImage); 
}); 

Das wird vor Ort arbeiten, aber diese Liste von URLs nicht über alle synchronisiert werden Browser. Stattdessen möchten Sie die Datenbank zum Synchronisieren der URLs verwenden, z. B. wie in Zero To App (video, code).