Ich denke, ich würde das Problem zuerst anhand eines Beispiels demonstrieren,
jsfiddle: Ссылка (Getestet mit FF 12 und Chrome 18.0.1025.168)
Verwendung:
Nicht-Webkit-Browser aktualisieren ihr Größenattribut nicht, wenn Benutzer Änderungen an der ausgewählten lokalen Datei vornehmen, während Chrome dies zum Beispiel tut. Beide Browser aktualisieren den Inhalt der Datei.
Gibt es eine Möglichkeit, Firefox dazu zu bringen, die Dateigröße zu aktualisieren, ähnlich wie Chrome in dieser Situation?
Der Benutzer wählt eine Datei aus, die zu groß für das Formular ist, sie drücken die Senden-Taste und werden benachrichtigt, dass ihre Datei zu groß ist (über eine Warnung, "Größen" -Leiste, siehe unten),
Sie ändern die Datei lokal und drücken erneut submit.
In Chrome wird die Dateigröße aktualisiert. Wenn der Benutzer die Übermittlungsschaltfläche erneut anklickt, überprüft er erneut seine aktualisierte Größe und ermöglicht den Upload. In Firefox muss der Benutzer die Datei im Formular erneut auswählen, bevor sich die Dateigröße ändert.
Eine teilweise Problemumgehung für Firefox - @ ZER0's antworten
Ein Zweck der Datei-API besteht darin, die Dateigröße auf der Client-Seite zu verifizieren, bevor sie auf einen Server hochgeladen wird, wenn ich mich nicht irre.
Berücksichtigen Sie das Szenario, in dem ein Uploadlimit von 2 MB in einem Formular vorhanden ist und der Benutzer eine 1 MB-Datei auswählt. Sowohl Firefox als auch Chrome sehen, dass die Dateigröße weniger als 2 MB beträgt, und fügen sie dem Formular hinzu. Lassen Sie uns auch sagen, dass es einen ordentlichen Balken gibt, der zeigt, wie groß eine Datei ist, die sie ausgewählt haben, und ob sie die Dateigröße überschreitet oder nicht:
Aber dann entscheidet der Benutzer, den Inhalt der Datei lokal zu ändern , bevor das Formular abschickt und die Größe über 2 MB erhöht.
In Google Chrome kann ich dies auf der Client-Seite elegant handhaben. Ich kann die Dateigröße erneut überprüfen, wenn der Benutzer das Formular absendet, und überprüfen, ob es tatsächlich noch unter 1 MB ist, bevor es an den Server gesendet wird. Aber bevor der Benutzer das Formular abschickt, kann ich in Chrome sogar so weit gehen, das Bild des kleinen Balkens dynamisch zu aktualisieren, da Änderungen lokal vorgenommen werden:
Dieser "Balken" (oder jedes andere Formular bei einer sofortigen Benachrichtigung, z. B. eine Warnung) ist nützlich, wenn der Benutzer ein großes Formular ausfüllt. Ich möchte, dass der Benutzer sofort weiß, wenn seine Datei zu groß ist und sie ihn dann korrigieren können, und nicht nur, wenn sie das Formular abschicken.
In Firefox, weil die Dateigröße niemals aktualisiert wird, lädt sie gerne die 2MB-Datei hoch und denkt, dass sie immer noch 1MB groß ist! Ich benutze serverseitige Logik, um die Dateigröße zu überprüfen, aber ich möchte lieber eine Server-Reise speichern.
Die oben genannten Beispiele beziehen sich auf mehr Leute, da sich wahrscheinlich mehr Leute mit Dateiuploads in Formularen beschäftigt haben als mit Slice-Funktion in der Datei-API . Dies ist genau, wie ich auf das Problem stoße.
In meinem Formular wählt der Benutzer eine Datei aus und wenn sie submit drücken, werden nur die letzten 10.000 Bytes auf dem Bildschirm in textarea
angezeigt, um zu bestätigen, dass es wirklich die gewünschte Datei ist.
Betrachten Sie eine Datei mit einer Größe von 50,000
bytes. Ein Benutzer wählt es im Formular aus, und sowohl Chrome als auch Firefox zeigen Bytes 40,000 - 50,000
in textarea
.
Jetzt fügt der Benutzer der Datei Inhalt hinzu und hebt dieselbe Datei auf 70,000
bytes!
Google Chrome wird das textarea
korrekt aktualisieren, um Bytes 60,000-70,000
zu enthalten. Da die Größe in Firefox konstant bleibt, werden nur Bytes im Bereich 40,000-50,000
angezeigt.
Bearbeiten: Die Datei jsfiddle wurde aktualisiert, um zu zeigen, dass FF den Inhalt der aktualisierten Datei immer noch lesen kann. Es ist nur so, dass sich die Dateigröße mit diesen neuen Inhalten nicht ändert.
Bearbeiten: Ссылка (Fehlerbericht)
Bearbeiten: Beispiele wurden hinzugefügt & amp; aktualisiert in Reaktion auf @ Eduárd Moldováns Kommentar & amp; @ ZER0's antworten . Danke!
Es scheint, dass Sie die Eigenschaft size
direkt erhalten, und weil der Wert in diesem Formularelement nicht geändert wird, ist es wahrscheinlich, dass Firefox die Eigenschaft size
ebenfalls nicht aktualisiert.
Als Workaround können Sie length
des gelesenen Inhalts überprüfen. Also anstelle von file.size
habe evt.target.result.length
.
Allerdings ist es definitiv ein Fehler für mich, also haben Sie es gut gemacht, es auf Bugzilla hinzuzufügen!
Aktualisieren :
Sie können weiterhin die String-Version von Slice verwenden. Wenn Sie es vorziehen (oder result
ist ein bestimmter Datentyp), können Sie von evt.target.result
eine neue erstellen Blob -Objekt (Das Dateiobjekt verwendet diese Schnittstelle), wo Sie sowohl size
-Eigenschaft als auch slice
-Methode verwenden können.
Tags und Links javascript html5 webkit firefox fileapi