Andreas
09.08.2007, 17:17
Worum geht es hier?
AJAX (Asynchronous JavaScript And XML) ist eine 'Web 2.0'-Technik, die schnelle Benutzer-Interaktion und somit dier Implementierung 'reicher' Web-Applikationen erlaubt.
Mit Hilfe von AJAX lassen sich Teile einer Seite aktulisieren ohne dass die komplette Seite neu geladen werden muss. Auch kann der Benutzer weiterarbeiten wähend noch Daten übertragen werden oder auf eine Serverantwort gewartet wird (=> asynchron).
Wie der Name schon andeutet spielt JavaScript hierbei eine entscheidenede Rolle: Mit Hilfe eines JavaScript Objekts (XMLHttpRequest) werden Anfragen an den Server gesendet, welcehr diese verarbeitet und XML zurückliefert.
Das zurückgelieferte XML wird wederum durch JavaScript ausgewertert/verarbeitet und ggf. Ausgaben erzeugt.
Und wofür wird das konkret genutzt?
vBulletin selbst setzt AJAX an vielen Stellen ein. Beispiele hierfür sind Schnellantwort, das Änderun von Thementiteln per Doppelklick, usw.
AJAX eignet sich immer dann wenn es um kleine Änderungen an der jeweils angezeigten Seite geht.
Wie kann ich das für eigene Scripte nutzen?
Zunächst einaml braucht es einen AJAX-fähigen Browser.
Glücklicherweise unterstützen alle halbwegs aktuellen Browser diese Technik.
Um auf Nummer sicher zu gehen kann die JavaScript-Variable AJAX_Compatible geprüft werden.
Ist diese true so unterstützt der Browser AJAX.
Da die verschiedenen Browser jedoch, wie so oft, unterschiedliche Implementierungen verwenden, ist es sehr mühselig direkt mit XMLHttpRequest zu arbeiten.
vBulletin bietet daher die JavaScript Klasse vB_AJAX_Handler an, welche ein browserübergreifendes Interface bereitstellt.
Die Anwendung von AJAX erfolgt wie bereits erwähnt in 2 Phasen: Der Anfrage an den Server und dem verarbeiten der empfangenen Daten.
Hier ein einfaches Beispiel: Beim Klick auf einen Link wird ajax.php?do=ajaxtest aufgerufen. Als POST-Parameter text wird hierbei der Text 'Hallo Welt' übergeben'.
Das PHP-Script ergänzt diesen um 'Es ist jetzt xx:xx Uhr' und liefert ihn zurück.
Als erstes ein wenig JavaScript:
CODE:
----------
Der Inhalt dieses Abschnitts ist nur für Lizenznehmer sichtbar, Sie werden derzeit jedoch nicht als Lizenzinhaber erkannt.<br />
<br />
Bitte öffnen Sie den <a href="http://members.vbulletin-germany.com/membersupport_priority.php">Kundenbereich</a>, tragen Sie Ihre E-Mail-Adresse ein, mit der Sie sich hier registriert haben und aktivieren Sie die Lizenzüberprüfung für http://www.vbulletin-germany.org.
----------
Der Parameter des Konstruktors gibt an ob die Operation asynchron (true) oder snychron (false) erfolgen soll.
Wie zu erkennen ist, wir der Methode onreadystatechange() der Name der Funktion übergeben, welche bei Antworten aufgerufen werden soll.
Die Methode send() hat 2 Parameter: Der erste ist die aufrurufende URL, der zweite (optional) die per POST zu übergebenden Variablen.
Die Funktion zur Verarbeitung der Antworten ist im groben immer so aufgebaut wei im Beispiel gezeigt (wobei natürlich noch Erweiterungen für Fehlerzustände, etc. empfehlenswert sind).
readyState = 4 bedeutet dass die Anfrage beendet wurde, status ist der zurückgelieferte HTTP-Status (200 für OK, 404 für nicht gefunden, usw.)
Das HTML zum aufrufen:
CODE:
----------
Der Inhalt dieses Abschnitts ist nur für Lizenznehmer sichtbar, Sie werden derzeit jedoch nicht als Lizenzinhaber erkannt.<br />
<br />
Bitte öffnen Sie den <a href="http://members.vbulletin-germany.com/membersupport_priority.php">Kundenbereich</a>, tragen Sie Ihre E-Mail-Adresse ein, mit der Sie sich hier registriert haben und aktivieren Sie die Lizenzüberprüfung für http://www.vbulletin-germany.org.
----------
Das Plugin (für Einstiegspunkt ajax_start) zum erzeugen der Antwort:
PHP:
----------
Der Inhalt dieses Abschnitts ist nur für Lizenznehmer sichtbar, Sie werden derzeit jedoch nicht als Lizenzinhaber erkannt.<br />
<br />
Bitte öffnen Sie den <a href="http://members.vbulletin-germany.com/membersupport_priority.php">Kundenbereich</a>, tragen Sie Ihre E-Mail-Adresse ein, mit der Sie sich hier registriert haben und aktivieren Sie die Lizenzüberprüfung für http://www.vbulletin-germany.org.
----------
Die PHP-Klasse vB_AJAX_XML_Builder wird hierbei zum erzeugen der Antwort (XML) verwendet. Für weiter Infos zu dieser Klasse siehe API-Dokumentation.
Zum auswerten des XML können die JavaScript Funktionen fetch_tags(), fetch_tag_count() und die Methode fetch_data() der Klasse vB_AJAX_Handler verwendet werden.
Die Eigenschaft responseXML enthält hierbei ein XML-Objekt mit der Antwort, responseText das ganze als Text.
AJAX (Asynchronous JavaScript And XML) ist eine 'Web 2.0'-Technik, die schnelle Benutzer-Interaktion und somit dier Implementierung 'reicher' Web-Applikationen erlaubt.
Mit Hilfe von AJAX lassen sich Teile einer Seite aktulisieren ohne dass die komplette Seite neu geladen werden muss. Auch kann der Benutzer weiterarbeiten wähend noch Daten übertragen werden oder auf eine Serverantwort gewartet wird (=> asynchron).
Wie der Name schon andeutet spielt JavaScript hierbei eine entscheidenede Rolle: Mit Hilfe eines JavaScript Objekts (XMLHttpRequest) werden Anfragen an den Server gesendet, welcehr diese verarbeitet und XML zurückliefert.
Das zurückgelieferte XML wird wederum durch JavaScript ausgewertert/verarbeitet und ggf. Ausgaben erzeugt.
Und wofür wird das konkret genutzt?
vBulletin selbst setzt AJAX an vielen Stellen ein. Beispiele hierfür sind Schnellantwort, das Änderun von Thementiteln per Doppelklick, usw.
AJAX eignet sich immer dann wenn es um kleine Änderungen an der jeweils angezeigten Seite geht.
Wie kann ich das für eigene Scripte nutzen?
Zunächst einaml braucht es einen AJAX-fähigen Browser.
Glücklicherweise unterstützen alle halbwegs aktuellen Browser diese Technik.
Um auf Nummer sicher zu gehen kann die JavaScript-Variable AJAX_Compatible geprüft werden.
Ist diese true so unterstützt der Browser AJAX.
Da die verschiedenen Browser jedoch, wie so oft, unterschiedliche Implementierungen verwenden, ist es sehr mühselig direkt mit XMLHttpRequest zu arbeiten.
vBulletin bietet daher die JavaScript Klasse vB_AJAX_Handler an, welche ein browserübergreifendes Interface bereitstellt.
Die Anwendung von AJAX erfolgt wie bereits erwähnt in 2 Phasen: Der Anfrage an den Server und dem verarbeiten der empfangenen Daten.
Hier ein einfaches Beispiel: Beim Klick auf einen Link wird ajax.php?do=ajaxtest aufgerufen. Als POST-Parameter text wird hierbei der Text 'Hallo Welt' übergeben'.
Das PHP-Script ergänzt diesen um 'Es ist jetzt xx:xx Uhr' und liefert ihn zurück.
Als erstes ein wenig JavaScript:
CODE:
----------
Der Inhalt dieses Abschnitts ist nur für Lizenznehmer sichtbar, Sie werden derzeit jedoch nicht als Lizenzinhaber erkannt.<br />
<br />
Bitte öffnen Sie den <a href="http://members.vbulletin-germany.com/membersupport_priority.php">Kundenbereich</a>, tragen Sie Ihre E-Mail-Adresse ein, mit der Sie sich hier registriert haben und aktivieren Sie die Lizenzüberprüfung für http://www.vbulletin-germany.org.
----------
Der Parameter des Konstruktors gibt an ob die Operation asynchron (true) oder snychron (false) erfolgen soll.
Wie zu erkennen ist, wir der Methode onreadystatechange() der Name der Funktion übergeben, welche bei Antworten aufgerufen werden soll.
Die Methode send() hat 2 Parameter: Der erste ist die aufrurufende URL, der zweite (optional) die per POST zu übergebenden Variablen.
Die Funktion zur Verarbeitung der Antworten ist im groben immer so aufgebaut wei im Beispiel gezeigt (wobei natürlich noch Erweiterungen für Fehlerzustände, etc. empfehlenswert sind).
readyState = 4 bedeutet dass die Anfrage beendet wurde, status ist der zurückgelieferte HTTP-Status (200 für OK, 404 für nicht gefunden, usw.)
Das HTML zum aufrufen:
CODE:
----------
Der Inhalt dieses Abschnitts ist nur für Lizenznehmer sichtbar, Sie werden derzeit jedoch nicht als Lizenzinhaber erkannt.<br />
<br />
Bitte öffnen Sie den <a href="http://members.vbulletin-germany.com/membersupport_priority.php">Kundenbereich</a>, tragen Sie Ihre E-Mail-Adresse ein, mit der Sie sich hier registriert haben und aktivieren Sie die Lizenzüberprüfung für http://www.vbulletin-germany.org.
----------
Das Plugin (für Einstiegspunkt ajax_start) zum erzeugen der Antwort:
PHP:
----------
Der Inhalt dieses Abschnitts ist nur für Lizenznehmer sichtbar, Sie werden derzeit jedoch nicht als Lizenzinhaber erkannt.<br />
<br />
Bitte öffnen Sie den <a href="http://members.vbulletin-germany.com/membersupport_priority.php">Kundenbereich</a>, tragen Sie Ihre E-Mail-Adresse ein, mit der Sie sich hier registriert haben und aktivieren Sie die Lizenzüberprüfung für http://www.vbulletin-germany.org.
----------
Die PHP-Klasse vB_AJAX_XML_Builder wird hierbei zum erzeugen der Antwort (XML) verwendet. Für weiter Infos zu dieser Klasse siehe API-Dokumentation.
Zum auswerten des XML können die JavaScript Funktionen fetch_tags(), fetch_tag_count() und die Methode fetch_data() der Klasse vB_AJAX_Handler verwendet werden.
Die Eigenschaft responseXML enthält hierbei ein XML-Objekt mit der Antwort, responseText das ganze als Text.