Szakkönyvek
Webalkalmazások fejlesztése Ajax segítségével
Az Ajax egyike a legújabb és legnagyszerűbb módszereknek, amelyek arra irányulnak, hogy élvezetesebbé tegyék a böngészést az Interneten, és új, izgalmas szolgáltatásokat nyújtsanak. Azáltal, hogy lehetővé teszi a weblapok egyes részeinek, hogy a teljes oldal frissítése nélkül jelenjenek meg, az Ajax jelentősen javítja a webalkalmazások nyújtotta élményt, a webfejlesztőknek pedig eszközt ad ahhoz, hogy könnyen és újszerűen használható, interaktív programokat építsenek.A Webalkalmazások fejlesztése Ajax segítségével olyan mélyreható ismereteket nyújt az Ajaxról, amelyek szükségesek ahhoz, hogy a fejlesztők webalkalmazásaikat magasabb szintre emeljék. A kötet bemutatja, hogyan készíthetünk Ajax-vezérelt webalkalmazásokat objektumközpontú szemlélettel, és ismertet több hasznos tervezési mintát is.
A könyv részletes útmutatójában megtaláljuk, hogyan kapcsolódhatunk egy MySQL adatbázishoz PHP 5 kóddal egy saját Ajax-motoron keresztül, és hogyan formázhatjuk elegánsan a választ CSS-sel, JavaScripttel és XHTML-lel, miközben szigorúan megőrizzük az adatok biztonságát. A kötet ezek mellett négy egyéni Ajax-képes összetevő használatát is bemutatja egy mintaprogramban, és leírja azt is, hogyan lehet ezeket elkészíteni.
A könyv utolsó része a korábbi fejezetekben bemutatott önálló kódpéldákat és eljárásokat egyetlen nagyobb, Ajax-vezérelt alkalmazásban egyesíti - egy olyan belső webes levelező programban, amelyet bármilyen felhasználó alapú webhelyen (mondjuk egy webes közösségben is) felhasználhatunk. Az Olvasó nem csak azt tanulja meg, hogyan készíthet és használhat saját, újrahasznosítható Ajax-összetevőket, hanem azt is, hogy miként kapcsolhatja azokat később felépítendő Ajax-alkalmazásokhoz.
Szerző: Kris Hadlock
Oldalszám: 288
Szint: középhaladó, haladó
Kiadó: Kiskapu Kiadó
ISBN: 9789639637238
Kiadás éve: 2007
I. rész • Az elsõ lépések
1. fejezet • Az Ajax bemutatása
Az XML DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Az elõnyök mérlegelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
2. fejezet • A kérelem
Az XMLHttpRequest részletesen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
Szabványos XHR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Adatbázis-megfelelõ XHR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Adatok küldése az adatbázis-megfelelõ XHR-eknek . . . . . . . . . . . . . . . . . 10
Az objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Aszinkron adatátvitel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
A készenléti állapot . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
HTTP-állapotkódok és -fejlécek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
3. fejezet • A válasz
XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Elemek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Jellemzõk . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
CDATA . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
Az XML elemzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
A JSON nyelvtana . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
A JSON használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
A JSON elemzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
4. fejezet • A válasz leképezése XHTML-lel és CSS-sel
XHTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
II. rész • A JavaScript-motor létrehozása és használata
5. fejezet • Objektumközpontú JavaScript
Objektumközpontú megközelítések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
A new mûvelet használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
Literális jelölés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
Társításos tömbök . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
JScript.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
Objektumkonstruktorok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
Példányok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
Tulajdonságok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
Tagfüggvények . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
Prototípusok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Példányok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
Tulajdonságok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
Paraméterek felülbírálása és felülírása . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
A tulajdonságok védelme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
Tagfüggvények . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
Objektumok bõvítése prototípusos tagfüggvényekkel . . . . . . . . . . . . . . . 53
6. fejezet • A motor elkészítése
Egyedi Ajax burkoló létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
Kérelmezés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
A készenléti állapot . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57
A válasz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
Ajax-frissítõ létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
Az objektum megalkotása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
A kérelmezõ objektum frissítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
A válasz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61
7. fejezet • A motor használata
Az elsõ lépések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
Kérelmek elkészítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64
Motorfüggvények és -tulajdonságok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65
8. fejezet • Hibakeresés
A JavaScript onerror eseménye . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68
responseText . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
IE Developer Toolbar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
A bõvítmény telepítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
A gyorstár kikapcsolása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
Navigáció a DOM-ban . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
Osztály- és azonosítóinformációk megtekintése . . . . . . . . . . . . . . . . . . . . 72
A Safari Enhancer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72
A Safari Enhancer telepítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
A JavaScript konzol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
A FireBug . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
A FireBug telepítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
A parancssor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75
Üzenetek naplózása a konzolban . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
Naplózási szintek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
Elemek vizsgálata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78
Az Ajax kikémlelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 80
9. fejezet • A motor bõvítése
A Utilities objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83
Állapotkódok kezelése HTTP-objektummal . . . . . . . . . . . . . . . . . . . . . . . . . . . 90
A HTTP-állapotkódok kategóriái . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92
A HTTP objektum használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98
III. rész • Újrahasznosítható elemek létrehozása
10. fejezet • Összecsukható elemek – harmonikák
Lássunk hozzá! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103
Az XML-szerkezet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104
Az XML-kérelem . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105
A harmonika objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 106
A panelek mûködése és az adatok megjelenítése . . . . . . . . . . . . . . . . . . . . . . 109
A CSS létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112
11. fejezet • Fanézet
Az adatok szerkezete . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116
A válasz kezelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118
A GUI létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119
Stílus hozzáadása az összetevõhez . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 124
12. fejezet • Ügyféloldali ellenõrzés
Lássunk hozzá! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127
Ellenõrzõ objektumok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129
A felhasználói bemenet ellenõrzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . 131
Vizuális visszacsatolás a felhasználónak . . . . . . . . . . . . . . . . . . . . . . . . . 133
A kiszolgálóoldal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134
A létrehozófüggvény . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136
A felhasználói adatok ellenõrzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
Felhasználók bejegyzése és beléptetése . . . . . . . . . . . . . . . . . . . . . . . . . 138
13. fejezet • Adatrácsok
Lássunk hozzá! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 141
Adatrács objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 143
Az adatok megjelenítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146
DataRow objektumok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147
Adatoszlop objektumok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150
Az összetevõ formázása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 151
IV. rész • Ajax-minták
14. fejezet • Az Egyke minta
Az Egyke minta áttekintése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155
Objektum létrehozása az Egyke mintával . . . . . . . . . . . . . . . . . . . . . . . . . . . . 156
Az Egyke objektumok használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159
15. fejezet • A Modell-Nézet-Vezérlõ minta
A minta áttekintése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 161
A minta elkészítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163
A minta használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 164
16. fejezet • A Megfigyelõ minta
A minta áttekintése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
Megfigyelõk feliratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
A megfigyelõk értesítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
Megfigyelõk leiratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 168
Hibakezelõ objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 168
Megfigyelõk feliratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 169
Megfigyelõk értesítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 170
Megfigyelõk leiratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
A hibakezelõ objektum használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174
17. fejezet • Az Adattükrözés minta
Áttekintés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 177
A Többfelhasználós minta . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 179
A minta megvalósítása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 180
18. fejezet • Együttmûködési minták
Elõzmények kezelése sütikkel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183
A Historian objektum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184
Az XML fájl létrehozása és megjelenítése . . . . . . . . . . . . . . . . . . . . . . . . 186
A Navigation objektum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 188
„Húzd és ejtsd” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
A DragDrop objektum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 190
19. fejezet • Használhatósági minták
A visszajelzések, hibák és figyelmeztetések kezelése . . . . . . . . . . . . . . . . . . . 198
Tervezés a kódban . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 201
V. rész • Együttmûködés a kiszolgálóoldallal
20. fejezet • Az Ajax és az adatbázisok együttmûködése
Kapcsolat a PHP-vel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
A rés áthidalása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
A kérelmek végrehajtása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 210
A kapcsolat létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215
21. fejezet • Együttmûködés adatbázisokkal: a kiszolgálóoldal
Kapcsolódás az ASP.NET-hez . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 225
Kapcsolódás a ColdFusionhöz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 229
22. fejezet • Az Ajax együttmûködése adatbázisokkal – magas szinten
Kötegelt frissítések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233
Tömbök küldése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234
XML küldése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235
JSON küldése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 236
Kiszolgálóoldali XML és JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 236
XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 236
JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237
VI. rész • Végsõ simítások
23. fejezet • Az alkalmazás biztonságossá tétele
Biztonsági rések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 241
Ajax-kérelmek jelszavas védelme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243
Egyedi jelszavak létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243
Jelszavak hitelesítése a kiszolgálóoldalon . . . . . . . . . . . . . . . . . . . . . . . . . . . . 245
24. fejezet • Gyakorlati tanácsok
A motor használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249
Tervezési minták . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
Összetevõk használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
Statikus és dinamikus válaszok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
A hibák és visszajelzések kezelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251
Az alkalmazás elõzményei . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251
Biztonság . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252
1. fejezet • Az Ajax bemutatása
Az XML DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Az elõnyök mérlegelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
2. fejezet • A kérelem
Az XMLHttpRequest részletesen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
Szabványos XHR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Adatbázis-megfelelõ XHR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Adatok küldése az adatbázis-megfelelõ XHR-eknek . . . . . . . . . . . . . . . . . 10
Az objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Aszinkron adatátvitel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
A készenléti állapot . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
HTTP-állapotkódok és -fejlécek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
3. fejezet • A válasz
XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Elemek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Jellemzõk . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
CDATA . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
Az XML elemzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
A JSON nyelvtana . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
A JSON használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
A JSON elemzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
4. fejezet • A válasz leképezése XHTML-lel és CSS-sel
XHTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
II. rész • A JavaScript-motor létrehozása és használata
5. fejezet • Objektumközpontú JavaScript
Objektumközpontú megközelítések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
A new mûvelet használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
Literális jelölés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
Társításos tömbök . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
JScript.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
Objektumkonstruktorok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
Példányok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
Tulajdonságok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
Tagfüggvények . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
Prototípusok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Példányok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
Tulajdonságok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
Paraméterek felülbírálása és felülírása . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
A tulajdonságok védelme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
Tagfüggvények . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
Objektumok bõvítése prototípusos tagfüggvényekkel . . . . . . . . . . . . . . . 53
6. fejezet • A motor elkészítése
Egyedi Ajax burkoló létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
Kérelmezés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
A készenléti állapot . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57
A válasz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
Ajax-frissítõ létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
Az objektum megalkotása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
A kérelmezõ objektum frissítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
A válasz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61
7. fejezet • A motor használata
Az elsõ lépések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
Kérelmek elkészítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64
Motorfüggvények és -tulajdonságok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65
8. fejezet • Hibakeresés
A JavaScript onerror eseménye . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68
responseText . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
IE Developer Toolbar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
A bõvítmény telepítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
A gyorstár kikapcsolása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
Navigáció a DOM-ban . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
Osztály- és azonosítóinformációk megtekintése . . . . . . . . . . . . . . . . . . . . 72
A Safari Enhancer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72
A Safari Enhancer telepítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
A JavaScript konzol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
A FireBug . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
A FireBug telepítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
A parancssor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75
Üzenetek naplózása a konzolban . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
Naplózási szintek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
Elemek vizsgálata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78
Az Ajax kikémlelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 80
9. fejezet • A motor bõvítése
A Utilities objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83
Állapotkódok kezelése HTTP-objektummal . . . . . . . . . . . . . . . . . . . . . . . . . . . 90
A HTTP-állapotkódok kategóriái . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92
A HTTP objektum használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98
III. rész • Újrahasznosítható elemek létrehozása
10. fejezet • Összecsukható elemek – harmonikák
Lássunk hozzá! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103
Az XML-szerkezet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104
Az XML-kérelem . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105
A harmonika objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 106
A panelek mûködése és az adatok megjelenítése . . . . . . . . . . . . . . . . . . . . . . 109
A CSS létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112
11. fejezet • Fanézet
Az adatok szerkezete . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116
A válasz kezelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118
A GUI létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119
Stílus hozzáadása az összetevõhez . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 124
12. fejezet • Ügyféloldali ellenõrzés
Lássunk hozzá! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127
Ellenõrzõ objektumok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129
A felhasználói bemenet ellenõrzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . 131
Vizuális visszacsatolás a felhasználónak . . . . . . . . . . . . . . . . . . . . . . . . . 133
A kiszolgálóoldal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134
A létrehozófüggvény . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136
A felhasználói adatok ellenõrzése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
Felhasználók bejegyzése és beléptetése . . . . . . . . . . . . . . . . . . . . . . . . . 138
13. fejezet • Adatrácsok
Lássunk hozzá! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 141
Adatrács objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 143
Az adatok megjelenítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146
DataRow objektumok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147
Adatoszlop objektumok létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150
Az összetevõ formázása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 151
IV. rész • Ajax-minták
14. fejezet • Az Egyke minta
Az Egyke minta áttekintése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155
Objektum létrehozása az Egyke mintával . . . . . . . . . . . . . . . . . . . . . . . . . . . . 156
Az Egyke objektumok használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159
15. fejezet • A Modell-Nézet-Vezérlõ minta
A minta áttekintése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 161
A minta elkészítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163
A minta használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 164
16. fejezet • A Megfigyelõ minta
A minta áttekintése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
Megfigyelõk feliratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
A megfigyelõk értesítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
Megfigyelõk leiratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 168
Hibakezelõ objektum létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 168
Megfigyelõk feliratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 169
Megfigyelõk értesítése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 170
Megfigyelõk leiratkozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
A hibakezelõ objektum használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174
17. fejezet • Az Adattükrözés minta
Áttekintés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 177
A Többfelhasználós minta . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 179
A minta megvalósítása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 180
18. fejezet • Együttmûködési minták
Elõzmények kezelése sütikkel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183
A Historian objektum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184
Az XML fájl létrehozása és megjelenítése . . . . . . . . . . . . . . . . . . . . . . . . 186
A Navigation objektum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 188
„Húzd és ejtsd” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
A DragDrop objektum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 190
19. fejezet • Használhatósági minták
A visszajelzések, hibák és figyelmeztetések kezelése . . . . . . . . . . . . . . . . . . . 198
Tervezés a kódban . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 201
V. rész • Együttmûködés a kiszolgálóoldallal
20. fejezet • Az Ajax és az adatbázisok együttmûködése
Kapcsolat a PHP-vel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
A rés áthidalása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
A kérelmek végrehajtása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 210
A kapcsolat létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215
21. fejezet • Együttmûködés adatbázisokkal: a kiszolgálóoldal
Kapcsolódás az ASP.NET-hez . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 225
Kapcsolódás a ColdFusionhöz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 229
22. fejezet • Az Ajax együttmûködése adatbázisokkal – magas szinten
Kötegelt frissítések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233
Tömbök küldése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234
XML küldése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235
JSON küldése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 236
Kiszolgálóoldali XML és JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 236
XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 236
JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237
VI. rész • Végsõ simítások
23. fejezet • Az alkalmazás biztonságossá tétele
Biztonsági rések . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 241
Ajax-kérelmek jelszavas védelme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243
Egyedi jelszavak létrehozása . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243
Jelszavak hitelesítése a kiszolgálóoldalon . . . . . . . . . . . . . . . . . . . . . . . . . . . . 245
24. fejezet • Gyakorlati tanácsok
A motor használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249
Tervezési minták . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
Összetevõk használata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
Statikus és dinamikus válaszok . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
A hibák és visszajelzések kezelése . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251
Az alkalmazás elõzményei . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251
Biztonság . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252
Kapcsolódó tanfolyamok:
Web, Webmester
Grafika, 3D, Videó