12. Mai. 2011 (12:42)

HTTP Upload - Schmerz lass nach!

Ich glaube man kann mit Fug und Recht behaupten, dass es ohne die Bilder und Videos der Internetbenutzer kein Web2.0 gäbe. Erfolgreiche Webseiten wie YouTube und Flickr basieren gerade auf die Möglichkeit Bilder / Videos - mit dem Browser hochzuladen. Zum Glück gibt es in HTML ein Formularelement <input type="file" /> das den Dateiupload ermöglicht, doch leider ist Formularelement eine Krankheit, die sowohl dem Anwender also auch dem Entwickler fortdauernde Schmerzen bereitet. crying

Zunächst ist mehr als störend dass der Anwender mit jedem Formularelement nur eine Datei auswählen kann. In einer Zeit, in der man Urlaubsfotos eher im Netz veröffentlicht als sie in Photoalben einzukleben ist das einfach nicht praktikabel. Sind endlich alle Dateien zum Upload ausgewählt und wurde der "Senden-Knopf" gedrückt, muss der Anwender warten bis alles komplett zum Server hochgeladen wurden und bekommt erst dann eine Rückmeldung - bis dahin: Sanduhrsad Das ist besonders ärgerlich, wenn sich der Upload wegen der geringen Bandbreite und / oder der großen Datenmenge über Minuten, wenn nicht Stunden hinzieht.

Aus Sicht des Entwicklers gibt es weitere Mängel des (standard) HTTP-Upload: Erstens) Alle Formulardaten (POST) werden komplett vom Browser an den Server übertragen und erst danach wird die Kontrolle an die Programme (z.B. PHP-Skripte) auf dem Server übergeben - also erst nachdem die gesamte Datei(en) vom Browser zum Server hochgeladen wurden. Das ist vorallem dann ärgerlich, wenn der Server die Datei ablehnt (z.B. weil ein Bild erwartet wurde, es wurde aber ein PDF hochgeladen). Zweitens) Da der Webserver die POST-Daten zwischenspeichern muss, macht es Sinn die Maximalgröße zu beschränken (z.B. auf 20 MByte). Daher können auch  keine Dateien hochgeladen werden die größer sind als dieses Limit (20 MByte). Nun mag das bei Bildern nicht so dragisch sein (20 MByte pro Bild mehr als genug). Sollen aber Videos in HD hochgeladen werden, ist man gezwungen das Limit deutlich anzuheben (z.B. auf 2000 MByte). Drittens) Das HTML Formularelement zum Dateiupload verhält sich nicht ganz so wie die anderen HTML Formularelemente (JavaScript, Darstellung, etc.). Viertens) Es fehlen Möglichkeiten die Dateiauswahl zu verbessern (z.B. Filter nach Dateiendungen, Mehrfachauswahl, etc.). Fünftens) Und überhaupt!

upload-1 SWF UPload Da ich mit diesen Schmerzen aber nicht alleine auf der Welt bin, gibt es eine vielzahl von Lösungen. Dabei stehen die Bedürfnisse der Anwender im Vordergrund: Dateiupload muss für den Benutzer einfach und komfortabel sein. Daher basieren die meisten Lösungen auf Browser-Plugins wie Flash. Diese werden anstelle des "normalen" HTML Formularelements gesetzt und ermöglichen so beispielsweise die Auswahl von mehreren Dateien. Eines dieser Tools ist SWFUpload , das - wie der Name schon sagt - auf Flash basiert und viele Möglichkeiten von der Fortschrittsanzeige bis hin zum eigenen Plugins bietet.

Damit der Dateiupload nicht nur hübscher aussieht, sondern auch technisch besser wird genügt es aber nicht, das GUI Element auszutauschen. So werden die oben angesprochenen Nachteile durch sog. Chunked-Upload  ausgemerzt. Dabei - wie auch in Wombat beispielhaft implementiert - erfolgt der Upload in drei Schritten:

  1. Initialisierung: Der Client kündigt dem Server einen Upload an (z.B. mit Dateigröße, Dateityp, etc.)
  2. Chunk Upload: Der Client lädt die Datei häppchenweise (z.B. jeweils 2 MByte) zum Server hoch - bis die gesamte Datei übertragen wurde.
  3. Finalisierung: An Ende setzt der Server die Chunks wieder zusammen und verabeitet die Datei

upload-2 Plupload Plupload ist ein anderes Tool das den Dateiupload im Browser verbessert. Es biete aber neben den Features von SWFUpload auch die Möglichkeit Dateien häppchenweise zum Server zu übertragen - Also genau dass, was Wombat (auf Serverseite) bereits kann! Beide zusammen - Plupload und Wombat - ermöglichen es von den Einschränkungen des HTTP-Uploads zu genesen und auf einmal sind die Schmerzen wie weggeblasen.

gERD Schaufelberger

zur Liste


Aktuelle Artikel