Meldung

09.08.2007 - Asynchrone Übertragung von Nutzdaten mit Ajax

Ajax – Abkürzung für Asynchronous JavaScript and XML – wird in Zeiten des Web 2.0 in zunehmendem Maße verwendet, um Internetseiten funktional aufzupeppen. Dabei geht es allerdings nicht nur darum, einen Internet-Auftritt schicker zu machen – auch die verwendete Hardware wird besser genutzt, der Datentransfer minimiert und auch die Skalierung eines Systems ist einfacher zu realisieren. Nach dem Laden der Seite wird per JavaScript eine Anfrage an den Server gestellt, in welcher Nutzdaten angefordert werden.

Der Zeitpunkt, zu dem die Nutzdaten angefordert werden ist projektspezifisch und orientiert sich am Anwendungsfall. So werden Daten per onLoad-Event direkt nach dem Laden der Seite angefordert, wenn keine weiteren Informationen (Parameter) benötigt werden um die benötigten Daten anzufordern. Aber auch andere Events, wie beispielesweise das Mausklick-Event, welches auftritt, wenn der Benutzer auf ein bestimmtes HTML-Element klickt, kann zur Initiierung eines Ajax-Requests dienen. Darüber hinaus wird das Bestätigen von in einem Formular getätigten Angaben oft dazu verwendet einen Ajax-Request mit entsprechenden Parametern auszustatten.

Als Antwort werden die angeforderten Daten entweder als Textdatei oder im XML-Format geliefert. Das XML-Format bietet gegenüber dem Textformat einen entscheidenden Vorteil. Zur Verarbeitung der empfangen Daten bietet JavaScript nämlich von Hause aus die Möglichkeit effektiv auf die gelieferten XML-Daten zuzugreifen. Dies erleichtert den Umgang mit den Nutzdaten.

Unter Verwendung des Document Object Model (DOM) können die empfangenen Daten in die bereits im Browser dargestellte Seite integriert werden. Das HTML-Element, unter dem die Daten eingefügt werden sollen, kann zum Beispiel mit der Methode getElementById ermittelt werden. Diese Methode des JavaScript-Objekts Document ist aber nur eine von vielen Möglichkeiten zum Auffinden eines Einhängepunktes. Anpassungen der Formatierung einer Seite können über CSS realisiert werden.

Ajax-Requests können auf verschiedene Arten abgesendet werden. Beim GET-Request werden die Parameter direkt in der URL angegeben. Mit Hilfe eines POST-Requests können umfangreichere Parameter an den Web-Service übergeben werden. Der HEAD-Request wird meist dazu verwendet, um herauszufinden, ob ein Service bereit ist Anfragen zu beantworten. Zu den genannten Request-Verfahren wird jeweils ein Beispiel anhand entsprechender Funktionen demonstriert.

In einem der Beispiele werden die einzelnen Abarbeitungsschritte eines Ajax-Requests demonstriert und die gelieferten Statuscodes (erklärt durch den Stati entsprechenden Zeichenketten) ausgegeben. Die Beispiele mit GET und POST nutzen zur Ausgabe der vom Ajax-Request gelieferten Informationen die Window-Methode zur Darstellung einer Dialogbox.

Alexander Müller