Teil 3: Ajax unter verschiedenen Browsern

Sie können generell keine Datei von Ihrem PC zum Server unter AJAX hochladen. Für einen Datei-Upload müssen Sie immer in einem Formular die zu ladende Datei wählen und dann das Formular zum Server senden. Das ist kein Browser-Fehler, sondern eine Sicherheits-Einschränkung. Sonst könnten Ihnen nämlich AJAX-Anwendungen Dateien vom PC stehlen. Innerhalb einer AJAX Anwendung, in der Sie Bilder hochladen möchten, lädt Ihnen ein Upload zwangsweise eine neue Seite - nämlich die action-URL des Upload-Formulars.

Das zerstört Ihnen zumeist die per AJAX aufgebaute und geänderte Seite mit der dazu gehörenden Browser-History. Um das zu vermeiden, können Sie im Prinzip nach dem Upload nur die ursprüngliche Seite wieder aufbauen. Die Zeit dafür geht in der Upload-Zeit unter. Ein Upload wird also immer eine neue Seite laden. Da Sie für den User die Arbeitsseite beibehalten, sieht es so aus, als passiere der Upload wie die anderen AJAX-Aktionen (fast) im Hintergrund.

Dazu macht entweder die Upload-action-Prozedur am Ende des Uploads keine eigene HTML-Ausgabe, sondern leitet per HTTP-Header auf Ihre AJAX-Haupt-Seite zurück. Bei dieser Weiterleitung sorgt ein Hash-String in der URL oder Daten-Übergabe in Session-Variablen für eine reibungslose Fortsetzung der Arbeit. Alternativ benützen Sie wie im Beispiel- Programm die ursprüngliche AJAX-Seite als Upload-action. In beiden Fällen werden Sie zumeist nach dem Neuladen der Seite per AJAX alle Arbeitsschritte nachspielen, um die Browser-History für den User wieder so aufzubauen, wie sie vor dem Upload war.

Unter Firefox können Sie es für den User so einrichten, dass der Upload und generell das Nachladen von Seiten als nur ein Arbeitsschritt unter vielen erscheint. Sie müssen nur bei einem Seitenwechsel trickreich vorgehen. Der Internet Explorer gestattet keinen reibungslosen Übergang zwischen zwei Seiten.

Wenn der User per back oder forward z.B. eine Stelle in der History positioniert, an der Dateien hochgeladen oder Parameter per POST übergeben wurden, dann verweigert der IE die Mitarbeit. Für statische Seiten macht diese Einschränkung Sinn, die Programmierung unter AJAX behindert dies eher.

Sie finden auf dem angegebenen Quicklink ein Testprogramm, das sowohl IE als auch Firefox unterstützt. Mit dem IEmacht es aber eher Sinn, zuerst alle Bilder hochzuladen und dann erst mit ihnen zu arbeiten. Mit Firefox dagegen können Sie Bilder verschieben, neu hinzuladen, weitermachen, wieder zurückgehen usw., als wäre der Upload ein Arbeitsschritt wie die anderen auch. Die verwendeten Prozeduren sind allerdings nicht ohne kleinere Haken: wz_dragdrop meldet Fehler mit dem neuesten Firefox und unterstützt nur Bild-Objekte wirklich einwandfrei. Der neue IE hat die beschriebenen Einschränkungen. Am saubersten läuft das Test-Beispiel mit Firefox.

Im unteren Debug-Fenster von Firebug beziehen sich die Warnmeldungen auf das Skript wz_dragdrop, die Sie unbesorgt in einer Testumgebung übergehen können. Firefox 2.0 hat nur die Schnittstelle geändert und macht laut und kryptisch auf Funktionen aufmerksam, die er bald nicht mehr unterstützt.