Ich habe ein bisschen ein einzigartiges Problem und ich habe verrückt versucht, es zu lösen.AngularFire2 verursacht Endlosschleifen in iOS-Browsern
Ich habe eine Angular2 App mit WebPack mit AngularFire2, um Metadaten zu manipulieren. Das aktuelle Feature, an dem ich gerade arbeite, ist die Möglichkeit, eine Datei auf Firebase Storage hochzuladen, die URL für diesen Speicherort zu erhalten und diese URL dann an die Metadaten des Objekts anzuhängen, in das die Datei hochgeladen wurde, damit der Benutzer sie anzeigen kann. Dies funktioniert wie in allen Desktop-und Android-Browsern gewünscht, aber scheitert an fast allen iOS-Browsern (getestet auf Safari, Chrome, Firefox, alle gleichen Ergebnisse) mit 0 Konsole oder Systemfehler, lehnt einfach keine weiteren Operationen auf der Website ab, kann nicht neu laden, kann nichts anderes tun, als erzwingen, den Tab oder die Browser-App schließen und neu laden.
Hier ist ein Abbau von meinem Code:
Dies ist der HTML-Code, der FirebaseListObservable Schleifen durch und zeigt die Daten in der Ansicht:
<div *ngFor="let item of items | async">
<input type="file" name="file" id="{{ item.$key }}" class="inputfile" (change)="uploadPicture($event, item)"/>
<label [attr.for]="item.$key">{{item.name}}</label>
<img *ngIf="item.fileUrl" src="../../assets/img/star.png" class="cell-img" (click)=showImg(item.fileUrl)>
</div>
Hochladen der Datei:
firebase.storage().ref().child('images/' + filename).put(file, metadata).then(snapshot => this.obtainUploadUrl(snapshot, key, filename));
Nach dem Abrufen der Dateispeicherort-URL und dem Übergeben des Firebase-Objektschlüssels (der sich in einer FirebaseListObservable befindet) aktualisiere ich die Liste wie folgt:
console.log("Updating", key, "With", data);
this.af.database.list('/games/' + this.currentGame.$key + '/items').update(key, data);
Nach bestem Wissen und Gewissen tritt der Fehler irgendwo ich die items Liste oder die lokale manipulieren this.items nach den Schnappschuss für das Hochladen von Dateien zu erhalten. Wenn ich versuche, ein Objekt in diesem FirebaseListObservable zu aktualisieren, zu schieben oder zu entfernen, funktioniert die mobile Site nicht mehr und bleibt in einer Endlosschleife stecken.
Es muss einen speziellen Fall geben, den ich nicht berücksichtige oder einen Missbrauch der Firebase-Objekte, mit denen iOS nicht zufrieden ist.
Jede Hilfe wird geschätzt, ich kann keine Lösung finden, aber Firebase nicht zu verwenden.
UPDATE
Nach einem weiteren Tag an sie hacken, ich habe die Feuerbasis gefunden, in einem iOS-Browser, mag keine Aktualisierung Ansicht Artikel innerhalb zumindest eine Eingangsklickfunktion.
<input type="file" name="file" id="{{ item.$key }}" class="inputfile" (change)="uploadPicture($event, item, items)"/>
Innerhalb dieser uploadPicture Funktion, wenn ich zwei Zeilen Code auszuführen:
firebase.storage().ref().child('images/' + filename).put(file, metadata).then(snapshot => console.log("File uploaded!", snapshot));
this.items.update(key, {fileName: filename});
Ich bekomme den gleichen Fehler in iOS. Wenn ich jedoch versuche, ein anderes Firebase-Objekt zu ändern, wird es bei mir nicht einfrieren. Ich bin mir immer noch nicht sicher, warum das momentan nur für iOS funktioniert, und ich habe immer noch keine Ahnung, wie ich dieses Problem überhaupt lösen kann.