PHP
Einträge für Monday, 8. January 2007
Blog abonnieren
Kategorien
Kalender
| « | January '07 | » | ||||
|---|---|---|---|---|---|---|
| M | T | W | T | F | S | S |
| 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| 8 | 9 | 10 | 11 | 12 | 13 | 14 |
| 15 | 16 | 17 | 18 | 19 | 20 | 21 |
| 22 | 23 | 24 | 25 | 26 | 27 | 28 |
| 29 | 30 | 31 | ||||
Suche
Top Referrer
www.keywordspy.com (2)
de.search.yahoo.com (1)
www.google.at (1)
www.google.de (1)
de.search.yahoo.com (1)
www.google.at (1)
www.google.de (1)
Jan 8: Schnelle Webanwendungen mit Prototype und JSON
Da es ja heutzutage keine Webanwendung mehr ohne AJAX auskommt, will ich auch hierzu einen kleinen Blog-Eintrag verfassen. Das Prinzip, das hinter AJAX steht sollte ja allgemein geläufig sein: Man kann mittels Javascript eine Anfrage an den Server stellen ohne die komplette Seite neu laden zu müssen. Diese Art des Requests macht eine Webseite viel dynamischer - die Antwortzeiten werden kürzer da auch die übertragene Datenmenge abnimmt. Das "A" im Namen steht hierbei für "asynchron", was soviel heißt, dass die JS-Anwendung nach Absetzen eines AJAX-Requests normal weiterarbeit und nicht direkt auf die Antwort des Servers wartet.
Als fertiges Javascript Framework bietet sich Prototype an, welches auch Ajax Funktionalität kapselt - hierzu seien die Klassen Ajax.Request und Ajax.Updater erwähnt - genauere Infos hierzu und zum gesamten Framework findet sich in der inoffiziellen Dokumentation.
Hm... im Titel stand doch was von JSON?
Angenommen wir haben eine komplexe Datenstruktur auf der Serverseite, die wir clientseitig verfügbar machen wollen, so kann dies sehr einfach mit Hilfe von JSON geschehen. Doch was ist JSON eigentlich? In der Wikipedia findet sich dieser Artikel darüber. Es ist also eine Art Objektbeschreibung, mit der in Javascript (und auch in jeder anderen Sprache, die JSON unterstützen) direkt gearbeitet werden kann - viel einfacher und kleiner als ein XML-File mit selbem Inhalt.
Am besten verständlich wird das an einem kleinen Beispiel:
Wir sehen einen Ajax-Request an /lottery/selectEvent.html, der nach Aufruf von lottery.selectEvent() ausgeführt wird.
Der Server antwortet nun mit einer Response, die von der Funktion, die unter "onSuccess" definiert ist asynchron verarbeitet wird. Als zweiten Parameter nimmt diese Funktion das Json Objekt, das vom Server gesendet wird.
Um die Einfachheit des Ganzen begreifen zu können fehlt allerdings noch der Codeschnipsel, auf den der Frontcontroller den Request delegiert...
Hier wird ein assoziatives Array zusammengekleistert, das die Daten enthält mit denen clientseitig gearbeitet werden soll und dieses der Funktion parseJson() übergeben, die in der Superklasse unsrer Action definiert ist:
Unfairerweise kommt mein Blog mit PHP-Doc Kommentaren in php-bb-Tags nicht klar, weshalb ich die In-Line Dokumentation zu beiden PHP Codestücken entfernt habe.
Deutlich erkennbar allerdings, dass die parseJSON() Funktion intern json_encode() aufruft, welche man sich für sein PHP selber compilieren kann. Wie das genau geht und weitere Infos finden sich auf der Homepage von Omar Kilani.
Gibts da nicht auch was von PEAR? Sicher gibt es das - allerdings kommt diese Version leider nicht mit ISO-8859-1 (besser gesagt mit "nicht-UTF-8") klar, sodass man dazu noch über utf8_decode() einen Wrapper schreiben müsste.
Unser Encodetes JSON-Objekt wird im Header der Response geliefert, vom Prototype korrekt ausgelesen und weiterverarbeitet wie man im ersten Codefetzen sieht.
Schön nicht?
Als fertiges Javascript Framework bietet sich Prototype an, welches auch Ajax Funktionalität kapselt - hierzu seien die Klassen Ajax.Request und Ajax.Updater erwähnt - genauere Infos hierzu und zum gesamten Framework findet sich in der inoffiziellen Dokumentation.
Hm... im Titel stand doch was von JSON?
Angenommen wir haben eine komplexe Datenstruktur auf der Serverseite, die wir clientseitig verfügbar machen wollen, so kann dies sehr einfach mit Hilfe von JSON geschehen. Doch was ist JSON eigentlich? In der Wikipedia findet sich dieser Artikel darüber. Es ist also eine Art Objektbeschreibung, mit der in Javascript (und auch in jeder anderen Sprache, die JSON unterstützen) direkt gearbeitet werden kann - viel einfacher und kleiner als ein XML-File mit selbem Inhalt.
Am besten verständlich wird das an einem kleinen Beispiel:
- var lottery = {
- selectEvent: function(eventid) {
- new Ajax.Request('/lottery/selectEvent.html', {
- method: 'post',
- parameters: 'eventid='+eventid,
- onSuccess: function(res, json) {
- $('title').value = json.title;
- $('description').value = json.description;
- }
- });
- }
- }
Wir sehen einen Ajax-Request an /lottery/selectEvent.html, der nach Aufruf von lottery.selectEvent() ausgeführt wird.
Der Server antwortet nun mit einer Response, die von der Funktion, die unter "onSuccess" definiert ist asynchron verarbeitet wird. Als zweiten Parameter nimmt diese Funktion das Json Objekt, das vom Server gesendet wird.
Um die Einfachheit des Ganzen begreifen zu können fehlt allerdings noch der Codeschnipsel, auf den der Frontcontroller den Request delegiert...
- public function executeSelectEvent() {
- $event = EventPeer::retrieveByPk($this->getRequestParameter('eventid'));
- 'title' => $event->getEventname(),
- 'description' => $event->getInformation()
- );
- return $this->parseJson($forJSON);
- }
Hier wird ein assoziatives Array zusammengekleistert, das die Daten enthält mit denen clientseitig gearbeitet werden soll und dieses der Funktion parseJson() übergeben, die in der Superklasse unsrer Action definiert ist:
- class myAction extends sfActions
- {
- protected function parseJson($forJson) {
- $json = json_encode($forJson);
- $this->getResponse()->setHttpHeader('X-JSON', '('.$json.')');
- return sfView::HEADER_ONLY;
- }
- }
Unfairerweise kommt mein Blog mit PHP-Doc Kommentaren in php-bb-Tags nicht klar, weshalb ich die In-Line Dokumentation zu beiden PHP Codestücken entfernt habe.
Deutlich erkennbar allerdings, dass die parseJSON() Funktion intern json_encode() aufruft, welche man sich für sein PHP selber compilieren kann. Wie das genau geht und weitere Infos finden sich auf der Homepage von Omar Kilani.
Gibts da nicht auch was von PEAR? Sicher gibt es das - allerdings kommt diese Version leider nicht mit ISO-8859-1 (besser gesagt mit "nicht-UTF-8") klar, sodass man dazu noch über utf8_decode() einen Wrapper schreiben müsste.
Unser Encodetes JSON-Objekt wird im Header der Response geliefert, vom Prototype korrekt ausgelesen und weiterverarbeitet wie man im ersten Codefetzen sieht.
Schön nicht?