Websiteentwicklung: AJAX: Was ist AJAX

Aus Wikibooks
Zur Navigation springen Zur Suche springen


Websiteentwicklung AJAX Was ist AJAX

AJAX ist ein englisches Apronym für die Wortfolge „Asynchronous JavaScript and XML“, das man grob übersetzen kann mit: "asynchrones Nachladen von Javascript plus dynamische Manipulation der DOM". Das X steht dabei eigentlich für XML, in der Praxis ist es aber eher ein Platzhalter: die Daten werden in X verschiedenen Formaten vom Server zum Client geladen.

Der Begriff wurde von Jesse James Garrett geprägt, siehe [1].

Das erste eingängige Beispiel ist vielleicht Google Suggests.

Bei klassischen Web-Applikationen sieht der Ablauf so aus:

  • URL eintippen
  • Warten (Webformular wird geladen*)
  • Formular ausfüllen
  • Formular ausfüllen
  • Formular ausfüllen
  • Formular absenden
  • Warten (Antwort wird geladen*)

Nur bei den mit Sternchen markierten Stellen passieren Datenübertragungen zwischen Server und Client - während die UserIn das Formular ausfüllt also gar nicht. Mit AJAX ändert sich das:

  • URL eintippen
  • Warten (Webformular wird geladen*)
  • Formular ausfüllen (Liste nachladen*)
  • Formular ausfüllen (Feld speichern*)
  • Formular ausfüllen (Bild austauschen*)
  • Formular absenden
  • Warten (Antwort wird geladen*)

Die Technologien[Bearbeiten]

AJAX vereinigt alle Technologien, die Sie in diesem Wikibook kennen gelernt haben:

  • Eine Seite wird per HTML und CSS dargestellt
  • Javascript setzt asynchrone XMLHttpRequests ab und definiert die Callback-Funktionen
  • Der Server empfängt eine HTTP-Anfrage und bearbeitet sie.
  • Per Javascript werden die Serverantworten mit Hilfe von DOM in die Seite integriert.

Entwicklungsumgebung für AJAX[Bearbeiten]

Um erfolgreich AJAX-Applikationen zu entwickeln empfiehlt sich die Verwendung eines AJAX-fähigen Debuggers wie z.B. der Firebug-Erweiterung von Firefox:

Libraries und Frameworks für AJAX[Bearbeiten]

Sie können AJAX auf verschiedenen Ebenen entwickeln:

Eigenbau
Sie schreiben selbst in Javascript. Dabei müssen Sie selbst die Browser-Unterschiede des XMLHTTPRequest-Objekts behandeln - nicht zu empfehlen
Clientseitige Bibliothek
Sie verwenden eine Bibliothek (engl. library), die das XMLHTTPRequest-Objekt kapselt, so dass Sie browserunabhängig arbeiten können. Sie schreiben auf der Webseite Javascript-Code und separat davon ein serverseitiges Programm. Beispiel: prototype.js
Framework mit Mapping
Sie verwenden ein Framework, das Javascript mit Ihrer bevorzugten serverseitigen Programmiersprache verbindet: Ein Javascript-Funktionsaufruf mit Javascript-Datentypen als Argumente wird z.B. automatisch in einen PHP-Funktionsaufruf umgesetzt (mit PHP-Datentypen als Argumente). Beispiel: Mybic für PHP, crVCL PHP Framework.
Framework, das Javascript generiert
Sie verwenden eine serverseitige Programmiersprache, die fertige AJAX-Komponenten anbietet, ohne dass Sie dafür Javascript programmieren müssen. Beispiel: Ruby on Rails.
Toolkit, das Javascript generiert
Sie verwenden clientseitig Ihre bevorzugte Programmiersprache (inkl. z.B. gewohnter IDE, Debug- und Testumgebung) und einen Compiler, der den Quellcode dieser Sprache in Javascript übersetzt. Beispiel: GWT (Google Web Toolkit)

Links[Bearbeiten]


One wikibook.svg Hoch zu AJAX | Vor zu AJAX-Applikationen kennen lernen Wikibooks buchseite.svg