Web Technológiák. Répási Tibor egyetemi tanársegéd. Miskolc Egyetem Infomatikai és Villamosmérnöki Tanszékcsoport (IVM)

Átírás

1 Web Technológiák Répási Tibor egyetemi tanársegéd Miskolc Egyetem Infomatikai és Villamosmérnöki Tanszékcsoport (IVM) Általános Informatikai Tanszék Iroda: Inf.Int Tel: 2101

2 Adminisztratív tudnivalók Tárgy címe: Web technológiák Neptun kód: GEIAL235N, GEIAL235L Jegyző: Répási Tibor, konz.: péntek 9:00-11:00 Ütemterv, jegyzetek, fóliák letölthetők Ütemterv: 31k Lezárás: aláírás, kollokvium (5 kredit) házi feladat (kb. 60 óra), vizsga (í + sz) Záróvizsga tárgy (egyes szakirányokon)!!!

3 A tárgy célja, tematikája A World Wide Web kialakulása, működése. A hipertext fogalma, jelentősége. Hipertext rendszerek modelljeinek megismerése. Technológiai alapok (HTML, CSS, http) Webalkalmazások problémaköre, megoldási lehetőségei. Webalkalmazás technológiák (PHP, JavaEE web tier) Korszerű webtechnológiák (Web2.0): AJAX, HTML5

4 Bevezetés Az írás és a beszéd az emberi kommunikáció sajátsága. A tudás forrásának számít. Írástörténelem: kézírás, kódexek 1450 Guttenberg: nyomdászat, könyvtárak 1945 Vannevar Bush: As We May Think c. sci-fi írása, a MEMEX gép fikciója a csatolt szöveg koncepció 1970 Ted Nelson: a hipertext, mint felhasználói interfész paradigma. Igény szerint szétágazó vagy megjelenő szöveg.

5 Bevezetés Az írás változásának társadalmi hatásai: Guttenberg előtt: kevesen tudnak írni, olvasni kevesen férnek hozzá könyvekhez kiváltság (első sorban szerzeteseké, papoké) Guttenberg után: egyre szélesebb körben hozzáférhetőek a könyvek uralkodók döntenek iskolarendszer bevezetéséről erősödő népművelés, az írás és olvasás általános műveltséggé válik

6 A HyperText paradigma A szöveg hiperhivatkozásokat tartalmaz, mely egy szövegelemhez másik szöveget (dokumentumot/dokumentumrészt) csatol. Megszűnik a lineáris olvasás kényszere, az olvasó a csatolt szövegek között navigálva olvassa a tartalmat. HyperText dokumentumok böngészéséhez speciális eszköz szükséges. Számos implementáció készül. (Hypertext Editing System - HES, Xanadu, on-line System NLS, stb.)

7 A Hypertext kiegészítései Hypermedia paradigma: a dokumetum multimédia elemekből áll (nem csak szöveg) pl. kép is lehet hivatkozás, képre is lehet hivatkozni Kiterjesztés hálózati közegre: a link leíró egy URL (Universal Resource Locator) URL elemei: Hogyan? Honnan? Mit? séma (protokoll), pl. domain név vagy IP cím, pl. users.iit.uni-miskolc.hu ösvény, pl. /~repasi pl.

8 Hipertext dokumentumok Dokumentumok szerkezetét, használatát, reprezentációját, tárolását modellezzük. Szerkezeti szemléletű modellek Hipertext Absztrakt Gép (HAM Hypertext Abstract Machine) Dexter hipertext modell Dinamikus (használati) modellek Trellis modell A World Wide Web hipertext modellje

9 HAM Hipertext absztrakt gép Réteges felépítésű, referencia modell: felhasználói felület rétege alkalmazási réteg tárolási réteg operációs rendszer réteg A dokumentumkezelés környezetét modellezi, elkülönítve a tárolás és feldolgozás moduljait. Réteges felépítésű: lehetőség minden rétegben több implementációra

10 A Dexter-féle referenciamodell Három rétegű modell: megjelenítési réteg tárolási réteg komponens réteg A hipertext dokumentum egymással hivatkozási kapcsolatban álló komponensek rendszere.

11 A Dexter-féle referenciamodell Komponensek: atom: atomi komponens (pl. szöveg paragrafus, kép, stb.) kompozit: összetett komponens, konténerbe szervezett komponensek együttese link: kapcsolati komponens, hivatkozás egy másik komponensre Egyszerűségének köszönhetően igen elterjedt: több hipertext-rendszer alapját képzi a Dexter-modell.

12 Trellis-féle (használati) modell Modellezi a felhasználó és a hipertext rendszer interakcióját is. Három réteg: absztrakt, tartalom, megjelentítés A Trellis-modell, mint Petri-háló: <S,T,F> S : dokumentumok halmaza T : állapotátmeneti csomópontok (link szövegek) halmaza F : kapcsolatok halmaza F S T T S

13 A WWW hipertext-modell Dokumentum-szerkezeti modellje alapját a Dexter-modell alkotja, annak megvalósítása. WWW dokumentumok technológiai rétegmodellje: tartalmi réteg: hipertext dokumentum reprezentációs réteg: HTML, DOM, SGML tárolási réteg: file, memória

14 A World Wide Web születése '80-as évek: Tim- Berners Lee a CERN mérnöke 1989 december: cikk a CERN-nél bevezetett ENQUIRE rendszerről: Egyik lehetőségként említi a World Wide Web fantázianevű dokumentumhálót.

15 A World Wide Web születése Robbanásszerű fejlődés kezdődik. A '90-as évek közepétől kereskedelmi célú alkalmazások veszik át a mozgatórúgó szerepét. Az eredeti elképzelés (dokumentumkezelő rendszer) kiegészül: alkalmazások felhasználói felülete lesz a WWW egy időben több felhasználó hozzáférhet (osztott alkalmazás) multi-tier alkalmazás (legalább kettő)

16 A World Wide Web születése 1994: megalakul a World Wide Web Consortium (W3C) az MIT-n Elnöke: Tim-Berners Lee Kompetenciája: a Web fejlődését biztosító technológiai kutatás és fejlesztés számos területen folyik a munka: architektúrák: DOM, XML, i18n, WS, stb. interakció: SVG, WebCGM, HTML, Style, stb. minőségbiztosítás: QA technológia és társadalom: szabadalmak, magánszféra, biztonság, stb. stb.

17 A WWW napjainkban Üzletiesített média Hírek, reklámok, magazinok, stb. On-line rádió és televízió Szolgáltatási csatorna Webáruházak, InternetBanking, árverés Közösségi tér Kommunikáció, közösség (iwiw, myspace, youtube, stb.) Tartalomkereső rendszerek Yahoo, Google, AskGeeves, stb.

18 Vigyázat, fogalomzavar World Wide Web hipertext (hipermédia) dokumentumrendszer szinonim nevek: WWW, web Internet globális kiterjedésű számítógéphálózat szinonim nevek: világháló internet / intranet az Internet technológiáját használó, de attól elszigetelt (vagy korlátozottan kapcsolt) számítógéphálózat Az Internet (vagy egy internet) szolgáltatása lehet a WWW hozzáférés.

19 A HTML nyelv Hipertext dokumentumok reprezentációját szolgáló leírónyelv Szöveghez adott meta-adatok szabályozzák a dokumentum megjelenítését Az XHTML szabvány az XML szintaxisát veszi át HTML szabványok HTML 4.01 XHTML 1.0 következő: HTML 5 (még tervezet)

20 A HTML nyelv A dokumentum felépítése: fej: dokumentumra vonatkozó meta-adatok erőforrások (pl. script, stíluslap, stb.) erőforrás hivatkozások törzs: dokumentum tartalom beágyazott erőforrások (pl. script) Szintaxis: ASCII karakterkészlet spec. karakterek: entitás hivatkozás (pl. á) elem: <html> </html>, <br/> elemek egymásba ágyazhatók (kötött struktúra!) attribútumok: <body id= torzs > </body>

21 Példa HTML dokumentum <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" " <html> <head> <title>www Oldal</title> </head> <body> <div align="center"> Ez egy példa HTML dokumentumra. </div> </body> </html>

22 HTML elemek Kép beillesztése: <img src= url /> Hiperhivatkozás <a href= url >link szöveg</a> Megjegyzés

23 HTML elemek - keretek A böngésző területet osztják fel <frameset cols= 20%,*,20% > <frame name= bal src= url1 /> <frame name= kozep src= url2 /> <frame name= jobb src= url3 /> </frameset> Hivatkozásokban: <a href= url target= frame_name >...</a> spec. targetek: _blank, _parent, _self, _top

24 HTML elemek - táblázat <table> <tr> <th>elso oszlop</th> <th>második oszlop</th> <th>harmadik oszlop</th> </tr> <tr> <td>1. adat</td> <td colspan= 2 >2-3. adat</td> </tr> </table>

25 Stílusok A probléma: egységes webhely arculat (sok oldal) sok egyedi szerkesztési igény nem tárolt oldalakra is arculatváltás Az igény: stílust szabályozó meta-adatok dokumentumból való kiemelhetőség A megoldás STYLE attribútum bevezetése stíluslapok CLASS attribútum bevezetése

26 Stílus kaszkád A stílus elemhez kötődik, stíluslap alapján Stíluslapok 1. böngésző (beépítve a böngészőprogramba) 2. külső stíluslap (külső stílusállományban) 3. belső stíluslap (a dokumentumfejben) 4. in-line stílus (az elem STYLE attribútumában) Minden elem a legmagasabb definiált precedenciájú stílusban jelenik meg.

27 HTML + CSS példa <!DOCTYPE html PUBLIC "- //W3C//DTD XHTML 1.1//EN" " DTD/xhtml11.dtd"> <html> <link rel="stylesheet" type="text/css" href="proba.css"/> <head> <title>www Oldal</title> </head> <body> <div>ez egy példa HTML dokumentumra.</div> <div class="kemelt">kiemelt szöveg.</div> </body> </html> body { background-color: #AABBCC } div { font-family: arial, helvetica; text-align: center } div.kiemelt { text-decoration: underline; font-weight: bold }

28 Pszeudo-stílusok Hivatkozás szövegre: a:link a:visited a:hover a:active Szöveg részekre: :first-line :first-letter Média print screen print,screen

29 Referenciák, tutoriálok

30 A http protokoll Hipertext átvitelre tervezett MIME által tartalomfüggetlen 7. szintű protokoll Állapot mentes Igénybe vett <7 szolgáltatások: összeköttetésalapú, duplex átvitel TCP/IP fölött működhet?

31 A http protokoll Kérés-válasz protokoll Két szereplője: kliens: aki kérdez szerver: aki válaszol Szcenárió (a kliens szemszögéből): kapcsolat felépítés (TCP) kérés küldés válasz fogadás kapcsolat bontás (?) HTTP/1.1 -től lehetőség Keepalive kapcsolatra!

32 Üzenetformátum RFC2616 Kérés (egyszerű): <method> <url> <crlf> Teljes kérés: <method> <path> <protocol version> <crlf> *(message-header <crlf>) <crlf> [<content-data>] Válasz: kérés metódusától függ

33 Kérés metódusok GET dokumentum kérése POST dokumentum kérése, de van paraméterátadás a kérés tartalom részében HEAD dokumentum meta-adatok kérése PUT, MKCOL, DELETE, OPTION, stb. speciális alkalmazások (pl. WebDAV) számára fenntartott metódusok

34 Egy forgatókönyv Böngészőbe beírtuk a URL-t domain névfeloldása után kapcsolódás a 80-as porthoz fejrész kérése: HEAD /~repasi/ HTTP/1.1 Host: users.iit.uni-miskolc.hu Várakozás válaszra

35 Egy forgatókönyv 2 Szerver válasza: HTTP/ OK Date: Tue, 19 Feb :19:16 GMT Server: Apache/ (Debian GNU/Linux) mod_jk2/2.0.4 PHP/ mod_ssl/ OpenSSL/0.9.7e Last-Modified: Mon, 15 Mar :58:20 GMT ETag: "247db87b f300" Accept-Ranges: bytes Content-Length: 784 Content-Type: text/html Státusz kódok : informális üzenetek : sikeresség : átirányítás : ideiglenes hiba : fatális hiba

36 Egy forgatókönyv 3 Böngésző kéri a dokumentum tartalmát: GET /~repasi/ HTTP/1.1 Host: users.iit.uni-miskolc.hu Szerver küldi a fejrészt és a tartalmat: HTTP/ OK Date: Tue, 19 Feb :47:43 GMT Server: Apache/ (Debian GNU/Linux) mod_jk2/2.0.4 PHP/ mod_ssl/ OpenSSL/0.9.7e Last-Modified: Mon, 15 Mar :58:20 GMT ETag: "247db87b f300" Accept-Ranges: bytes Content-Length: 784 Content-Type: text/html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> <HTML>...

37 Összefoglalás Félév kezdési adminisztratív teendők Hypertext rendszerek kialakulása Hypertext modellek A World Wide Web létrejötte A HTML nyelv alapjai Stílusok használata A http protokoll

39 HTML űrlapok Weboldalon felhasználó által kitölthető űrlap A form elem tartalmazza. Attribútumai: Action: az URL, ami az adatokat fogadja Method: a küldéshez használandó http metódus Űrlap elemek: Szövegbeviteli mező Jelszóbeviteli mező Többsoros szöveg beviteli mező Lista, egy vagy több kijelölhető elemmel Legördülő lista Kiválasztó-, nyomó- és rádió- gombok Küldés és visszaállítás gombok

40 HTML űrlapok Speciális lehetőség: fájl feltölés, mint beviteli mező Minden beviteli elemnek van NAME attribútuma, tartalma egyedi. Beviteli elemek eseményei: onchange: érték megváltozásakor onsubmint: az űrlap küldésekor (előtt) onreset: az űrlap visszaállításakor onselect: kijelölés alkalmával onblur: fókusz elvesztésekor onfocus: fókusz megszerzésekor Kliens oldali validáció lehetősége.

41 Adatküldés http kérésben GET metódussal: URL-encoding A form elem action attribútumában lévő URL-t kiegészíti a beviteli elemek név=érték listájával. Az URL hossza korlátos, csak kis mennyiségű adat küldhető.

42 Adatküldés http kérésben POST metódussal: A kért URL a form action értéke A http kérés fej tartalmaz content-type és content-lenght attribútumokat A beviteli elemek név=érték listája a http kérés tartalom részében kerülnek átadasra Fájl feltöltés csak ezzel a metódussal lehetséges, multipart/mime kódolással (form elem encoding att.)

43 Űrlap adatok feldolgozása Speciális lehetőség: action= mailto:< cím> Szerver oldali feldogozó program által: Beviteli elemek értékének kinyerése Adatellenőrzés méretre, típusra! Tartalom értelmezése Veszély: Egy feldolgozó bárhonnan kaphat bemenetet, nem csak a hozzá tartozó űrlaptól! Alapelv: A felhasználói bemenet megbízhatatlan!

44 Weboldalak dinamikus előállítása Statikus weboldal: Tárolt oldal, ált. a szerver fájlrendszerén Módosítása automatizálható Lehet program által generált Előállítása a felhasználói eseményekkel asszinkron Dinamikus weboldal: Általában nem tárolt oldal Program állítja elő vagy módosítja Előállítása felhasználói eseménnyel szinkron Az előállító program a webszervertől szeparált, futhat A böngészőben! CGI környezetben Beépülhet a webszerverbe, mint content handler

45 Weboldalak dinamikus előállítása Kliens oldali megvalósítás: a böngészőben fut Beágyazott objektum (pl. Java Applet, ActiveX vezérlő, Flash, stb.) A megjelenítő terület egy téglalap alakú részét kezeli A beágyazó dokumentumtól független Saját eseménykezelővel rendelkezik Gyakran korlátozott jogosultságú kisalkalmazás Futtató környezetét a böngésző (plug-in) biztosítja A dokumentum részét képző script A böngésző értelmezi A dokumentumhoz kötött program Böngésző és dokumentum objektumokon tud manipulálni A dokumentum elemeinek és a böngésző eseményeit kezeli Nyelve többféle lehet (pl. JavaScript, VBScript)

46 Weboldalak dinamikus előállítása Szerver oldali megvalósítás: CGI szabvány: Bizonyos (konfigurált) URL-ek kezelésére a szerver az URL-hez kötött programot indít (gyerekprocesszben) Paramétereket környezeti változóként adja át A http kérés fejrésze paraméter, adat tartalma stdin A kiszolgáló processz kimenete (stdout) a http válasz lesz A kiszolgáló processz hibakimenetét (stderr) a szerver naplózza Content handler (webszerver tulajdonság): A webszerver beépülő modulja (plug-in) -> értéknövelt webszerver, alkalmazásszerver URL-hez vagy fájltípushoz köthető A http kérésre a választ a content handler állítja elő

47 JavaScript Netscape fejlesztés, korábbi neve LiveScript A Java megnevezés üzleti fogás, a Sun Java technológiájához nincs köze! Weboladlak dinamikussá tételére fejlesztették ki Szerver és kliensoldali használatra egyaránt alkalmas, de csak kliens oldali használata terjedt el Szintaxisa C szerű, gyengén típusos, semantikája a Self nyelvhez áll közel. ECMA-262 (ECMAScript) szabvány implementációja, sok kiegészítéssel. Rokonok: JScript, VBScript, ActiveScript, JSON, AppleScript

48 HTML események A HTML dokumentum a böngészőben példányosul, elemeit objektumok reprezentálják OOP alapelv az eseményvezérlés, azaz objektumok reagálhatnak eseményekre Az objektum reakciója egy eseményre, az eseménykezelő lefuttatása Dokumentum objektumok eseménykezelőjét a dokumentum elemeihez kötjük, attribútum formájában.

49 HTML események Esemény attribútumok: onmouseover: egér fölötte van az elemnek onmouseout: egér lement az elemről onmousemove: egér mozog az elemen onmousedown: egér gomb lenyomás onmouseup: egér gomb elengedés onclick: kattintás az elemre ondblcllick: dupla kattintás az elemre onload: a dokumentum betöltése Elemhez kötődnek, de vannak megszorítások! Az attribútum értéke az eseménykezelő script.

50 Document Object Model - DOM Általános modell XML dokumentum OO példányosítására. Objektum hierarchia reprezentálja a dokumentum elemeit. A JavaScript HTML DOM a dokumentum elemeket reprezentálja Minden elemhez létezik azonos nevú objektum Objektumok között az elembeágyazással analóg szülő-gyermek kapcsolatok

51 Document Object Model - DOM

52 Document Object Model - DOM Legfontosabb elemek: Document: a dokumentumot reprezentálja Anchors, forms, images, links tömb tagok URL, body, domain, cookie adattagok Open, close, write metódusok GetElementById, getelementsbyname, getelementsbytagname navigációs metódusok <img src= kep.jpg onclick= self.src='kep2.jpg' />

53 Példa <body onload= document.getelemetbyid('hidepage').style.visibility = 'hidden' > <div id="hidepage">loading...</div> Ez egy nagy dokumentum, sok képpel, melyek betöltése időigényes! </body>

54 További JavaScript objektumok Window: A böngésző megjelenítő területe A DOM hierarchia gyökere Navigator: Böngészőt reprezentáló objektum A JavaScript runtime hozza létre Screen: A megjelenítő képernyő tulajdonságait hordozza History: A böngészővel meglátogatott URL-ek listája Location: Címsor, ami az URL-t tartalmazza

55 Példa kép átméretezés <html> <head> <script type="text/javascript"> function changesize() { document.getelementbyid("compman").height="250" document.getelementbyid("compman").width="300" } </script> </head> <body> <img id="compman" src="compman.gif" width="107" height="98" /> <br /><br /> <input type="button" onclick="changesize()" value="change height and width of image"> </body> </html>

56 Példa új oldal előállítása <html> <head> <script type="text/javascript"> function createnewdoc() { var newdoc=document.open("text/html","replace"); var txt="<html><body>learning about the DOM is FUN!</body></html>"; newdoc.write(txt); newdoc.close(); } </script> </head> <body> <input type="button" value="open and write to a new document" onclick="createnewdoc()"> </body> </html>

57 Példa új dokumentum több keretben <html> <frameset id="myframeset" cols="50%,50%"> <frame id="leftframe" src="frame_src.htm"> <frame id="rightframe" src="frame_a.htm"> </frameset> </html> <html> <head> <script type="text/javascript"> function newsrc() { parent.document.getelementbyid("leftframe" ).src= " parent.document.getelementbyid("rightframe"). src= " } </script> </head> <body> <a href= # onclick="newsrc()">link</a> </body> </html>

58 Példa üzenetablak megjelenítés <html> <head> <script type="text/javascript"> function disp_alert() { alert("i am an alert box!!") } </script> </head> <body> <input type="button" onclick="disp_alert()" value="display alert box" /> </body> </html>

59 Példa input ablak <html> <head> <script type="text/javascript"> function disp_prompt() { var name=prompt("please enter your name","harry Potter") if (name!=null && name!="") { document.write("hello " + name + "! How are you today?") } } </script> </head> <body> <input type="button" onclick="disp_prompt()" value="display a prompt box" /> </body> </html>

60 CGI Célja, hogy a http kérés kiszolgálását egy program végezze. A webszerver csak közvetít A kiszolgáló program a webszerver gyermekprocesszeként fut Környezeti változókban paramétereket kap Bemenetén a http kérés tartalma (ha van ilyen) Kimenete a http válasz lesz Hibakimenetét a szerver naplózza (konfiguráció)

61 CGI környezet Http kérésből származó változók QUERY_STRING CONTENT_LENGTH, CONTENT_TYPE HTTP_USER_AGENT REMOTE_ADDR REQUEST_METHOD REMOTE_USER Server paraméterek SERVER_NAME, SERVER_PORT SCRIPT_NAME DOCUMENT_ROOT, PATH_INFO

62 CGI kimenet Fej és tartalom részből áll Fejben legalább Content-Type attribútum kell Üres sor az elválasztó jel Tetszőleges tartalmat adhat Példa: Content-type: text/html <HTML><HEAD> <TITLE>output of HTML from CGI script</title> </HEAD><BODY> <H1>Sample output</h1> What do you think of <STRONG>this?</STRONG> </BODY></HTML>

63 CGI implementáció Tetszőleges futtatható program lehet (C/C++, Pascal, shell script, stb.) Speciális feladat a környezeti változók és a bemenet kódolásának kezelése. Speciális eszközök: Függvénykönyvtárak (pl. libcgi) Scriptnyelvek segédkönyvtárral (pl. perl) Célnyelvek (pl. php)

64 Teljesítmény Minden kérést új processzben futó kiszolgáló program szolgál ki. A kiszolgáló program befejeződésével a processz megszűnik. Új processzek létrehozása időigényes. Minden kiszolgáló processz a webszervert működtető gépen fut. Nincs terhelésmegosztás A kiszolgáló programnak időkorlátja van A böngésző bontja a kapcsolatot, ha nem kap választ A felhasználó türelmetlen, a frissítés csak ront a helyeten

65 Content handler Egyes webszerverek képesek értéknövelt szolgáltatást nyújtani. URL vagy erőforrás típushoz kötött feldolgozó lehet a webszerverben. Nem szabványos megoldás, de elterjedt. Az alkalmazás webszerver függő lehet. Előnye: Nem kell külön processz a kiszolgáláshoz A worker több kérést is kiszolgálhat eletciklusában A feldolgozó példányok erőforrásokon osztozhatnak

66 Biztonság Content handler: Minden feldolgozó a szerver jogosultságával fut Hibás működés a webszerver stabliltását befolyásolja Konkurenciakezelés hiánya a megosztott erőforrásokra. CGI: Gyakran a webszerver jogosultságával fut A SU-CGI igen időigényes Könnyű túlterhelni a gépet A védelmet minden programban egyedileg kell megvalósítani Speciális alkalmazáskörnyezet, szokatlan programozói megoldásokat kíván meg

67 Elterjedt megoldások PHP, mint content handler Elfogadható teljesítmény Nincs terhelésmegosztás Nincs védelem PHP, CGI kiszolgálóként Gyenge teljesítmény Nincs terhelésmegosztás Védelem lehetséges, de jelentős teljesítményveszteség az ára Alkalmazásszerver használata Integrált szolgáltatásrendszerű futtató környezet Policy alapú biztonság, jól szabályozható Terhelésmegosztás, nagy rendelkezésreállás Számos termék: Java EE, JBoss, Oracle AS, Zope, stb.

68 Felhasználó azonosítása Igény: felhasználó azonosítása Megoldási lehetőségek: Alkalmazás szintű: külön bejelentkező oldal Protokoll szintű: HTTP-Auth mechanizmus Böngésző/OS szintű: csak Windows domain-ben Feladatok: Állapot mentes protokollon állapot nyilvántartás Felhasználó azonosítása név/jelszó megadásával Biztonságos kommunikáció (lopás, csalás)

69 Alkalmazás szintű megoldás A bejelentkezést az alkalmazás valósítja meg Külön bejelentkező oldal (űrlap) Külön felhasználói adatbázis Külön biztonsági rendszer az alkalmazásban Sok fejlesztői feladat, sok hiba lehetőség: Biztonságos azonosítás, titkosított átvitel Felhasználói adatbázis megvalósítása Hozzáférés szabályozása Kivételek kezelése Azonos feladatok, minden alkalmazásban újbóli fejlesztés?

70 HTTP-Auth A http protokoll szolgáltatása. Többféle mechanizmus (basic, digest) Szokásos felhasználói adatbázisok használata Böngésző támogatás szükséges (van) Alkalmazástól független Biztonságos (bizonyos feltételek mellett) Implementálhatja a webszerver vagy az alkalmazás Nem mindenre megoldás

71 Basic authentication 1. Kérés: GET /private HTTP/1.1 Host: localhost 1. Válasz: HTTP/ Unauthorised WWW-Authenticate: Basic realm="privát" Content-Type: text/html Content-Length: 311 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " <HTML> <HEAD> <TITLE>Error</TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso "> </HEAD> <BODY><H1>401 Unauthorised.</H1></BODY> </HTML>

72 Basic authentication 2. Kérés: GET /private HTTP/1.1 Host: localhost Authorization: Basic QwxhZGRpbjpvcGVuIHNlc2FtZQ== 2. Válasz: HTTP/ OK Date: Sat, 27 Nov :19:07 GMT Content-Type: text/html Content-Length:

73 Basic authentication Probléma: a kód a felhasználó:jelszó -t tartalmazza a base64 kód nem titkosítás a böngésző minden kérésben küldi nincs kilépés / kiléptetés jelszóátvitellel járó eljárás Lehetséges biztonsági megoldás: https kommunikáció (http ssl titkosítású csatornán)

74 Digest authentication Challange/Response azonosítás 1. Kérés: GET /private HTTP/1.0 Host: localhost 1. Válasz: HTTP/ Unauthorised Date: Sun, 10 Apr :26:47 GMT WWW-Authenticate: Digest qop="auth,auth-int", nonce="dcd98b7102dd2f0e8b11d0f600bfb0c093", opaque="5ccc069c403ebaf9f0171e9517f40e41" Content-Type: text/html Content-Length:

75 Digest authentication 2. Kérés: GET /private HTTP/1.0 Host: localhost Authorization: Digest username="alladin", nonce="dcd98b7102dd2f0e8b11d0f600bfb0c093", uri="/dir/index.html", qop=auth, nc= , cnonce="0a4f113b", response="6629fae49393a c4ef1", opaque="5ccc069c403ebaf9f0171e9517f40e41" 2. Válasz: HTTP/ OK Date: Sun, 10 Apr :27:03 GMT Content-Type: text/html Content-Length: 7984

76 Digest authentication HA1=md5(user+ : +realm+ : +passwd) HA2=md5(query) Response=md5(HA1+ : +nonce+ : +nc+ : +cnonce+ :auth: +HA2) A felhasználói adatbázis rekordja: user:realm:ha1

77 Digest authentication Előnyök: nincs tárolt jelszó (lásd felh. adatbázis) nincs jelszó átvitel (a HA1-ből md5 hash) a szerver válasza nem hamisítható (nonce) a kliens válasza nem hamisítható (cnonce) egy kihívásra csak egyszer lehet próbálkozni (nc) azonosított munkafolyamat (opaque) Hátrányok: egyedi felhasználói adatbázis bonyolult számítás (gyenge gépeken)

78 HTTP-Cookie Cookie: korlátos méretű adatcsomag kliens/szerver kommunikáció sajátsága szerver készíti és küldi kliens tárolja és visszaadja Alkalmazási terület: testreszabás, beállítások mentése munkafolyamat követés (session-cookie)

79 HTTP-Cookie Kérés: GET /index.html HTTP/1.1 Válasz, cookie beállítás: HTTP/ OK Content-type: text/html Set-Cookie: name=value, expire=timestamp, domain=mydom, path=/, secure=false (content of page) Kérés: GET /spec.html HTTP/1.1 Cookie: name=value Accept: */*

80 HTTP-Cookie Cookie attribútumok: név: változó azonosító érték: változó érték lejárati idő: időpecsét, ameddig érvényes domain: a szerver ahonnan jött ösvény: az URL ösvény része ahova visszajuthat titkos: logikai érték, titkosított kapcsolatot igényel-e Egy domain/ösvény párhoz több cookie is tartozhat. A böngésző mindet küldi a kérés fejlecében. Küldéskor (c->s) csak név/érték kerül átadásra. Szerver csak név, érték, lejárat, ösvény és titkos tulajdonságokat állíthatja be.

82 Mai program Webalkalmazás fogalma, tulajdonságai Alkalmazások anatómiája állapotok és átmenetek párhuzamos folyamatok Folyamatok modellezése Johnson, Petri Webalkalmazás állapota, állapotátmenetei megvalósítási alternatívák Biztonsági kérdések session biztonsága adatbiztonság védelem visszaélések ellen

83 Webalkalmazások Definíció: olyan szoftver alkalmazás, melynek hozzáférését web böngésző biztosítja Internet vagy intranet hálózaton keresztül. Nézőpontok: felhasználói felület (UI) szoftver architektúra szolgáltatási csatorna elosztott alkalmazás platform

84 Webalkalmazás, mint UI Felhasználó szemszögéből: felhasználói felület minden webalkalmazás hasonló felülettel bír egységes kliens (böngésző) vékony kliens -> kis erőforrásigény Tulajdonságai: + bárhonnan hozzáférhető + tetszőleges eszközön használható hagyományos alkalmazásoktól eltérően viselkedik hálózati kapcsolat elengedhetetlen

85 Webalkalmazás, mint szoftver architektúra Programozó szemszögéből: több részes (multi-tier) architektúra (min. 2) egyszerű, megjelenítő független UI leíró számos fejlesztőkörnyezet áll rendelkezésre Tulajdonságai: + egyszerű UI megvalósítás + kötetlen fejlesztői környezet állapot mentes UI kapcsolat szokatlan fejlesztési módszertanok nem általános biztonsági követelmények

86 Webalkalmazás, mint szolgáltatási csatorna Üzleti szempontból: egy szolgáltatás nyújtására lehetőséget adó eszköz Tulajdonságai: + felfogható üzlethelységként + olcsón üzemeltethető + széles körben elterjedt, mindenütt jelenlévő + nagy célcsoport a szolgáltatás automatizált nyújtását követeli meg meglévő szolgáltatások átstrukturálása költséges

87 Webalkalmazás, mint elosztott alkalmazás platform Rendszer integrátor szempontjából: a szolgáltatás nyújtása decentralizálható nem csak UI szolgáltatás, ún. Webservice is lehetséges Tulajdonságai: + szolgáltatások decentralizálhatók + WS jól integrálható a SOA szemléletbe + nagy rendelkezésre állás, nagy terhelhetőség + hibatűrő architektúra publikus interfész, támadási felület sok egyedi fejlesztési igény

88 Webalkalmazások Népszerűségének okai: Kliense: Web böngésző Mindenhol hozzáférhető Vékony kliens Alkalmazás: Központi szoftver Terjesztés nélkül frissíthető Gyakori alkalmazások: webmail, áruház, aukció, csapatmunka szervezés, vitafórum, wiki, blog szerepjáték, stb.

89 Webalkalmazások kialakulása Kezdeti kliens-szerver alkalmazások egyedi klienssel -> telepítés, frissítés kényszere Webalkalmazás Felhasználói felülete: dinamikusan előállított weboldal Kliense: szabványos web böngésző Interaktivitás növelése: kliens oldali script (JavaScript) A HTML/XHTML szabvány bővíthető weboldalak előállítását teszi lehetővé. Bővítés: (Java, JavaScript, Flash, stb.) Funkcionális: az UI viselkedését befolyásolja Megjelenítési: egyedi megjelenítés lehetősége Vastag kliens

90 Webalkalmazások napjainkban Igen elterjedtek, dinamikusan fejlődnek. Számos alkalmazási terület: hírek, közösség, bank, árverezés, kereskedelem, stb. A HTML, CSS, JavaScript DOM szabványok eltérő implementációi komoly gondokat okoznak. Tipikusan három rétegű (three-tire) alkalmazás Többnyire vékony kliens; a flash nem ritkaság Alkalmazás logika, adatháttér: igen változatos lehet, sokféle elterjedt technológia Szabványos: Java alapú,.net alapú Gyakori még: PHP/MySQL, Oracle AS, stb.

91 Alkalmazások anatómiája Alkalmazás: együttműködő programok Program = Adatstruktúrák + Algoritmusok (N. Wirth) Adatstruktúrák: értékei állapotot tükröznek. Algoritmusok: állapot átmenetet valósítanak meg. Állapot: adatstruktúrák, adatbázisok Állapot átmenet: algoritmus, vezérlés néha: alkalmazás (vagy üzleti) logika (AL / BL)

92 Alkalmazások anatómiája Elosztott alkalmazások: egyetlen AL sok munkafolyamat (session) Munkafolyamat: az alkalmazás egy állapotváltozási fonala állapota a munkafolyamatnak van az AL feldolgozási környezete (kontextusa) Nem összetévesztendő a session felhasználóval klienssel

93 Munkafolyamatok modellezése Számos matematikai megközelítés Johnson Petri Két típus: instrukció folyam (code flow): Neumann-gép adat folyam (data flow): adatfolyam-gép

94 Folyamat modellezés Másik slideshow

95 Munkafolyamat webalkalmazásokban Probléma webalkalmazások esetén: Az alkalmazásprotokoll (http) állapotmentes Nincs viszony szolgáltatás (session service) a hálózati (TCP/IP) stack-ben. Megvalósítás: Alkalmazásban egyedileg Keretrendszerben

96 Munkafolyamat megvalósítás Feladat: Adatok tárolása az alkalmazás egyes állapotai között Független tranzakciók számára közös környezet Megvalósítási lehetőségek: Round-trip Alkalmazás session, azonosító round-trip: Session Cookie Hidden input URL rewrite (ábrák!)

97 Biztonsági kérdések (session) Hamisítás (fraud): Session adatok védelme (alkalmazás session) Azonosító lopás (theft): Újrafelhasználás Más munkafolyamatának ellopása Alkalmazás túlterhelés (DoS) Elvesztett session Elhagyott session Tömeges nyitás

98 Biztonsági kérdések (adat) Adatátvitel során átvitt adatok védelme lehallgatás ellen újrahasznosítás ellen hamisítás ellen Lehetséges megoldások: titkosított csatorna - http alatti SSL titkosítás jelszó átvitelének mellőzése (ch/resp) adatok digitális aláírása

99 Visszaélés elleni védelem Alkalmazás védelme visszaélések ellen: automatizált használat (pl. tömeges regisztráció) nem kívánt műveletek végrehajtása Megvalósítás: Fordított Turing próba audiovizuális kihívás (captcha) az automatizált használat elleni védelem kijátszható (pl. relay támadással) szoftver validáció és verifikáció védelem nem kívánt műveletek ellen az alkalmazás logikában a tesztelés nehézkes, gyakran egyedi eszközökre szorul, módszertana komplex

101 Mai program A PHP nyelv architektúra működési modell nyelvi elemek API Adatbázis elérés Fájl feltöltés kezelése PostgreSQL nagy objektumok Objektum orientált programozás PHP-ban

102 A PHP nyelv kialakulása 1994 R Ras a mus s Le m rdorf us Lerdorf: Personal Homepage CGI programok gyűjteménye 1995: interpreterrel kombinálva PHP/FI - Personal Home Page Tools, később PHP PHP 3: izraeli továbbfejlesztés, PHP: Hytertext Preprocessor (megjelenés 1999) 2000 PHP 4: Zend Engine PHP 5: OOP kiegészítés

103 A PHP nyelv Reflektív programozási nyelv Célnyelv: dinamikus weboldalak előállítására Szerver oldali script nyelv Interpretált Szintaxis: C-hez hasonló Szemantika: Self Gyengén típusos HTML beágyazás: <?php?>

104 PHP példa <html> <head> <title>php Test</title> </head> <body> <?php echo '<p>hello World</p>';?> </body> </html>

105 PHP példa 2 (kicsit értelmesebb) <?php echo $_SERVER['HTTP_USER_AGENT'];?>

106 PHP Nyelvi elemek Szintaxis: hasonlít az ANSI C-re Szemantika: Self Gyengén típusos Kiterjedt API Típusok: boolean, integer, float (double), string array, object resource, NULL mixed, number, callback Tömb: asszociatív van foreach szerkezet

107 PHP Nyelvi elemek változók $ jellel kezdődik neve '[a-za-z_\x7f-\xff][a-za-z0-9_\x7f-\xff]*' pl: <?php $var = 'Bob'; $Var = 'Joe'; echo "$var, $Var"; // outputs "Bob, Joe"?> $4site = 'not yet'; // invalid; starts with a number $_4site = 'not yet'; // valid; starts with an underscore $täyte = 'mansikka'; // valid; 'ä' is (Extended) ASCII 228.

108 PHP nyelvi elemek Beépített változók (tömbök) $_SERVER: a CGI környezet változói $_GET: http GET kérés paraméterei $_POST: http POST kérés paraméterei $_REQUEST: http kérés paraméterei $_COOKIE: a kérésben kapott cookie-k $_SESSION: session változók

109 Űrlapok feldolgozása <form action="action.php" method="post"> <p>your name: <input type="text" name="name" /></p> <p>your age: <input type="text" name="age" /></p> <p><input type="submit" /></p> </form> Hi <?php echo htmlspecialchars($_post['name']);?>. You are <?php echo (int)$_post['age'];?> years old.

110 Cookie kezelés Script beállíthat HTTP-Cookie-t (HTTP-head) setcookie() függvény: a script elején, minden output-ot megelőzve name, value, expire, path, domain, secure a request cookie-kat a $_COOKIE tömb tartalmazza

111 Session kezelés A session_start() fgv. indítja ill. használja $_SESSION változó globális változója a munkafolyamatnak Megavalósítás: PHPSESSID azonosító Cookie-ban hidden menzőben URL-ben a kérések között a $_SESSION változó filbe-ba szerializálódik A session_start() -ra hasonló követelmények vonatkoznak, mint setcookie()-ra.

112 Session kezelés Timeout értéket a php.ini rögzít A session_destroy() fgv. törli a munkafolyamatot bárhol hívható

113 PHP API Kiterjedt függvénykönyvtár Dinamikusan betölthető modulok Funkció szerinti csoportosítás névkonvenció: <csoport>_<függvény> Függvény csoportok: session kezelés adatbázis elérés (csoportok) fájlkezelés hibakezelés, naplózás képkezelés hálózatkezelés stb.

114 PHP adatbázis elérés Több függvénycsoport: MySQL, MS SQL, PostgreSQL, Oracle, ODBC, stb. Hasonló funkcionalitású függvények minden csoportban: connect: kapcsolódás query: lekérdezés insert, update, delete: gyakran csak query resultset kezelők close: kapcsolat zárás pconnect: perzisztens kapcsolódás Univerzális adatbáziskapcsolati réteg: DBX

115 Adatbázis hozzáférés - DBX DBMS független API natív DBMS API függvényeket használ Használata: kapcsolat nyitás (dbx_connect) SQL utasítás feldolgozás (dbx_query) kurzor feldolgozás (dbx_fetch_row) kurzor rendezés (dbx_sort, dbx_compare) hibakezelés (dbx_error) sztring kvótázás (dbx_escape_string) kapcsolat bontás (dbx_close)

116 DBX Példa <?php $link = dbx_connect(dbx_pgsql, "giediprime", "users", "username", "password") or die("could not connect"); foreach ($result->data as $row) { echo "<tr>\n"; foreach ($row as $field) { echo "<td>$field</td>"; $result = dbx_query($link, 'SELECT id, parentid, description FROM table'); if (is_object($result) ) { echo $result->rows; // number of records echo $result->cols; // number of fields echo "<table>\n"; } echo "</tr>\n"; } echo "</table>\n"; }else { exit("query failed"); } dbx_close($link);?>

117 Teljesítmény Kapcsolatfelépítés időigénye: Perzisztens kapcsolat SQL parsing: tárolt eljárások hosszú feldolgozási idő: asszinkron végrehajtás (DBX nem támogatja!)

118 Biztonsági kérdések SQL injection: dinamikus SQL utasítás felhasználói inputtal megoldás: (DBMS függő) sztring kvótázás, (pl. dbx_escape_string) HTML injection: felhasználói input kerül a válaszoldalra megoldás: HTML tag-ek kvótázása (htmlspecialchars) PHP hibakezelés és kivételkezelés

119 Fájl feltöltés Fájl feltöltés feltételei HTML űrlapon: POST metódus űrlap kódolás: "multipart/form-data" file típusú beviteli elem fájlméret korlátozható MAX_FILE_SIZE nevű hidden elemmel, a fájl elem előtt A szerveroldali alkalmazásnak kezelni kell: feltöltés tényét (fájlok neve, mérete, tartalom típusa) fájlok tartalma

120 Fájl feltöltés  <form enctype="multipart/form-data" action=" URL " method="post">  <input type="hidden" name="max_file_size" value="30000" />  Send this file: <input name="userfile" type="file" /> <input type="submit" value="send File" /> </form>

121 Fájl feltöltés $_FILES változó tartalmazza a feltöltött fájlok meta-adatait: 2 dim. asszociatív tömb: 1. dim: input elem neve 2. dim: $_FILES['userfile']['name']: fájl név $_FILES['userfile']['type']: MIME típus $_FILES['userfile']['size']: mérete byte-ban $_FILES['userfile']['tmp_name']: feltöltési neve $_FILES['userfile']['error']: hibakód (PHP 4.2-től) Tartalomkezelő függvények: is_uploaded_file() : tényleg feltöltött fájl move_uploaded_file() : feltöltött fájl tartalmának mentése

122 Fájl feltöltés <?php $uploaddir = '/var/www/uploads/'; $uploadfile = $uploaddir. basename($_files['userfile']['name']); echo '<pre>'; if (move_uploaded_file($_files['userfile']['tmp_name'], $uploadfile)) { echo "File is valid, and was successfully uploaded.\n"; } else { echo "Possible file upload attack!\n"; } echo 'Here is some more debugging info:'; print_r($_files); print "</pre>";?>

123 Fájl feltöltés Korlátozások: lehet tiltva feltöltési méret korlátozás (def. 2M) PHP script futásidő korlátozás Biztonsági megfontolások: feltöltött script futtatás meglévő script futtatása nem feltöltött fájlokon

124 Postgres nagy objektumok Adatbázisban tárolhatók nagy objektumok Oracle: LOB (CLOB, BLOB) mezőtípus PostgreSQL: mezőn kívüli LO MySQL: nincs igazán (text mezőtípussal helyettesíthető) PostgreSQL saját függvényekkel kezeli, az adatbázis fájlrendszerszerűen használható lo_import, lo_export lo_open, lo_close lo_read, lo_read_all lo_unlink

125 Postgres nagy objektumok Haszna: nagy mennyiségű, strukturálatlan adat tarolásra bináris adatok tárolására Használata: létrehozás pl. lo_import -tal fájlból van oid-ja, amit táblában tárolni kell pg_lo_real_all() kiolvassa az egész lo-t és a PHP script kimenetére másolja

126 Postgres nagy objektumok <?php if (!isset($_get['image'])) { include('na.html'); exit(0); } $qstr = "select fname, upload, ftype, fcontent from arlista inner join docs on arlista.arlista = docs.fid where arlista.id = '".pg_escape_string($_get['image'])."'"; $conn = pg_connect( connstr ); pg_query($conn, "BEGIN"); $res = pg_query($conn, $qstr);

127 Postgres nagy objektumok if (pg_num_rows($res)!= 1) { include('na.html'); pg_free_result($res); exit(0); } $ftype = pg_fetch_result($res, 0, "ftype"); $fname = pg_fetch_result($res, 0, "fname"); $ftime = pg_fetch_result($res, 0, "upload"); $fcontent = pg_fetch_result($res, 0, "fcontent"); header('content-type: '.$ftype); header('content-disposition: attachment; filename="'.$fname.'"'); header("expires: Mon, 26 Jul :00:00 GMT"); header("last-modified: ". gmdate("d, d M Y H:i:s", $ftime). " GMT"); header("cache-control: no-store, no-cache, must-revalidate"); header("cache-control: post-check=0, pre-check=0", false); header("pragma: no-cache");

128 Postgres nagy objektumok $lo = pg_lo_open($conn, $fcontent, "r"); pg_lo_read_all($lo); pg_lo_close($lo); pg_query($conn, "END"); pg_free_result($res);?>

129 Tanszéki PostgreSQL Regisztráció: jön, ha elkészült a felhasználó adatbázis: host=giediprime.iit.uni-miskolc.hu port=5432 database=users user=<ldap login> password=<változó> jelszó parancssori kliensről: LDAP jelszó jelszó PHP scriptből: beállítható alter user <jelhnev> encrypted password 'jelszo';

130 Tanszéki PostgreSQL Kliens: Linux labor: psql, pgadmin3 Sun labor: psql Windows labor: pgadmin3

131 Objektum orientált programozás PHP-ban OOP alapelvek (ismétlés): egységbezárás adat rejtés öröklés (kiterjesztés) többalakúság (polymorphism) üzenet vezérlés (message-passing) Alapfogalmak: objektum, osztály tag: adattag, metódus; osztálytagok konstruktor, destruktor felüldefiniálás, elfedés, túlterhelés

132 Objektum orientált programozás PHP-ban PHP 4: kezdetleges OOP nyelvi elemek fejlesztési zsákutca PHP 5: más OOP nyelvekből átvett nyelvi elemek, de PHP 4 örökség nem igazi OOP nyelv!

133 Osztályok, objektumok Osztály definició: class class SimpleClass { // member declaration private $var = 'a default value'; } // method declaration public function displayvar() { echo $this->var; }

134 Példányosítás Csak dinamikus példányosítás van: $a = new SimpleClass(); // echo $a->$var ; $a->displayvar(); Referencia alapján hivatkozhatóak a tagok. Objektumok megszüntetése: csak automatikusan: a referencia nélküli objektumok megszűnnek a program befejeződésekor

135 Automatikus betöltés Az osztály kódját példányosítás előtt be kell tölteni (include-olni a forrást). Lehet automatikusan is: function autoload($class_name) { require_once $class_name. '.php'; } Következetes kódolást és névkonvenciót követel meg!

136 Konstruktor Osztálynak lehet construct() metódusa. Példányosításkor meghívódik, paramétert kaphat. Nincs implicit szülő konstruktor hívás. Explicit hivatkozás: parent:: construct(); PHP 4 örökség: ha nincs construct() metódus, akkor meghívódik az osztálynévvel egyező nevű metódus!

137 Destruktor Osztálynak lehet destruct() metódusa. Objektum megszüntetése előtt hívódik, nincs paramétere. Nincs implicit szülő destruktor hívás. Objektumok csak a program leállásakor szűnnek meg.

138 Láthatóság Tagok láthatóságát szabályozhatjuk: public, protected, private Nem látható tag hivatkozása fatális hiba. Örökölt, szülőben privát tag nem definiáltnak tűnik.

139 Láthatóság class MyClass { public $public = 'Public'; protected $protected = 'Protected'; private $private = 'Private'; } function printhello() { echo $this->public; echo $this->protected; echo $this->private; } $obj = new MyClass(); echo $obj->public; // Works echo $obj->protected; // Fatal Error echo $obj->private; // Fatal Error $obj->printhello(); // Shows Public, Protected and Private

140 Láthatóság class MyClass2 extends MyClass { // We can redeclare the public and protected method, but not private protected $protected = 'Protected2'; } function printhello() { echo $this->public; echo $this->protected; echo $this->private; } $obj2 = new MyClass2(); echo $obj2->public; // Works echo $obj2->private; // Undefined echo $obj2->protected; // Fatal Error $obj2->printhello(); // Shows Public, Protected2, Undefined

141 Scope operátor (::) Célja: osztálytagok és konstansok hivatkozása szülő osztály hivatkozás parent::tag

142 Osztálytagok Minősítés: static Nem példányosul, hivatkozni csak osztály alapján lehet. Nem hivatkozhat nem statikus tagra. Csak a definiáló osztályban hivatkozható. Nem definiálható felül, csak elfedhető!

143 Konstansok osztályban Minősítés: const Változónévben nem szükséges a $ jel. Inicializálása csak konstans kifejezéssel. Nem adható neki érték. Hivatkozása az osztálytaghoz hasonló.

144 Absztrakt metódus és osztály Absztrakt metódus: nincs törzse csak metódus deklaráció nem lehet osztálytag minősítése: abstract Absztrakt osztály: nem példányosítható ha van absztrakt metódusa, akkor az osztálynak is absztraktnak kell lenni minősítése: abstract

145 Interfészek Osztályhoz hasonló definició az interface kulcsszóval. Publikus metódusokat deklarál. Megvalósíthatja osztály az implements kulcsszó után felsorolt interfészeket kell megvalósítania az osztálynak. Interfészben deklarált, meg nem valósított metódus az osztályban absztraktnak látszik! Azonos nevű metódus deklarációt tartalmazó interfészek nem valósíthatók meg egyidejűleg.

146 szennyes titkok - mágikus metódusok Minden osztálynak vannak mágikus metódusai: Példánykezeléshez: construct(), destruct() Örökléshez: set(), get(), isset(), unset(), call() Állapotkezeléshez: sleep(), wakeup(), tostring(), set_state() Mágikus metódusok implicite hívódnak. Minden -al kezdődő nevű metódus potenciálisan mágikus.

147 Ami kimaradt Objektum iterátorok. A final kulcsszó. Objektumok klónozása. Objektumok összehasonlítása. Késői kötés. Reflexió.

148 Kivételek PHP-ban Van kivételkezelés try catch blokk definiálható throw kulcsszó Exception osztály konstruktor kivételével minden final csak kiegészíteni lehet. Kivétel destruktorból nem dobható. Konstruktorból dobott kivétel automatikus betöltés esetén fatális hibát okoz.

150 Webalkalmazások Java EE környezetben A Java: programozási nyelv programozói interfész (API) platformfüggetlen futtató környezet (JVM) Célterületi: általános célú szoftvertechnológia: SE mobil eszközök alkalmazáskörnyezete: ME nagyvállalati alkalmazáskörnyezet: EE Az ME és EE az alkalmazáskörnyezetnek megfelelő kiegészítése az SE elemeinek. Minden az SE elemekre épül!

151 Nagyvállalati alkalmazások Nagyvállalati alkalmazáskörnyezet igényei: elosztottság komponensalapúság tranzakcióvezéreltség hordozhatóság Fejlesztési kihívások: gyors fejlesztési ciklusok olcsó fejlesztés kis erőforrásigény

152 Nagyvállalati alkalmazások Az ideális fejlesztőkörnyezet tulajdonságai: robosztus, de nem bonyolult programozási nyelv kiterjedt és konzisztens általános célú API elosztottságot biztosító futtatókörnyezet komponensmodell független az alkalmazás futtatókörnyezetétől integrált szolgáltatások: tranzakcióvezérlés, perzisztencia, szolgáltatási csatornák, kommunikáció, erőforráshozzáférés, stb. nyílt szabványok olcsó, gyorsan elsajátítható fejlesztőkörnyezet

153 Java EE Java SE alapú Alkalmazásmodell: elosztott komponensalapú többrétegű (4) Futtatókörnyezet: nyílt specifikáció komponens konténerek konténer szolgáltatások egységes interfésszel Csomagolt alkalmazások

154 Java EE Alkalmazásmodell rétegek: EIS: adatbázisok, háttérrenszerek Business Tier: alkalmazáslogikai komponensek Web Tier: megjelenítési és szolgáltató komponensek Client Tier: alkalmazások kliens és/vagy web böngésző

155 Java EE Konténer típusok: Java EE server: EJB és Web konténer EJB konténer: perzisztens entitás objektumok, munkafolyamat komponensek, üzenetvezérelt komponensek Web konténer: JSP lapok, Servletek esetleg JavaBean komponensek Alkalmazás kliens konténer: alkalmazások Applet konténer: kisalkalmazások

156 Java EE web tier Webalkalmazás: dinamikus web/alkalmazás szerverkiegészítés Két alkalmazástípus: Megjelenítés-orientált Szolgáltatás-orientált Webalkalmazás komponensek: Java Servlet JSP webszolgáltatás végpont

157 Java EE web tier 1.kérés a konténerhez 2.megfelelő komponens metódus hívás 3.JavaBean hívás 4.erőforrás hozzáférés 5.válasz készítés 6.válasz küldés

158 Java EE web tier Servlet: Java nyelven írt osztály, mely kérések dinamikus kiszolgálását végzi JSP: szöveg dokumentum, mely servletként fut le. Statikus tartalom előállítása természetesebben történik. Servelt és JSP felcserélhető, de mindkettőnek megvannak az előnyei: Servlet: webszolgáltatás végpont, megjelenítő alkalmazás vezérlésfeldolgozója JSP: jelölt szöveg előállítására (HTML, SVG, XML, WML, stb.)

159 Java EE web tier További technológiák: JSTL: JSP jelöléskészlet kiegészítésére JSF: MVC alkalmazásmodell megvalósítása Mindennek az alapja: Java Servlet

160 Java EE web tier A web konténer szolgáltatásai: kérés dispatcher biztonság menedzser konkurrencia menedzser életciklus menedzser erőforrás menedzser Webalkalmazás telepítése (deploy) alkalmazás csomag (.war): program, statikus tartalom, konfiguráció (deployment descriptor) az alkalmazásszerver (web konténer) menedzsment felületén történik

161 Webalkalmazás Életciklus 1.web komponens kódjának fejlesztése 2. deployment descriptor fejlesztése 3. web komponensek és segédosztályok fordítása 4. alkalmazáscsomag készítése (opcionális) 5. telepítés a webkonténerbe 6. használat (web böngészővel) Web erőforrások: web komponensek, statikus állományok együttese Web modul: web erőforrások legkisebb telepíthető és használható egysége

162 Webalkalmazások Web modul tartalma: web erőforrások szerver oldali erőforrások: adat és kapcsolati komponensek (JavaBean) alkalmazás konfiguráció alkalmazás kiegészítések (TagLibrary) kliens oldali erőforrások: Java Applet programok kódja Applet segédkomponensek A modul tartalma rögzített szerkezetű jegyzékstruktúra, melynek csúcsa az assembly root.

163 Webalkalmazások A modul jegyzékstruktúrája kötött, case sensitive. A modul egyetlen állományba jar tömörítéssel,.war végződéssel tárolódik. Fájlnév = alkalmazásnév

164 Webalkalmazások A Java EE 5 -től az erőforrás leírók előállítása annotációk útján automatizált. Erőforrások JNDI név alapján érhetők el. A konténer szolgáltatót kapcsol a névhez. A konténer gondoskodik: kapcsolat kötegelésről kapcsolat perzisztenciáról terhelésmegosztásról JDBC kapcsolatok létrehozását a konténer SecurityManager-e korlátozhatja és rugalmatlanná teszi az alkalmazást.

165 Java Servlet Java nyelven írt osztály. Megvalósítja a javax.servlet.servlet interfészt. Kérésekre válaszol, általában HTTP -n. Fejlesztéshez a GenericServlet osztályt terjesztjük ki. HTTP szervlet fejlesztéshez a HttpServlet osztályt: doget, dopost, stb. metódusokat biztosít HTTP kérés, válasz, munkafolyamat és cookie támogatást biztosít

166 Java Servlet Életciklus: egy servlet-re leképzett kérés kiszolgálásakor a konténer: Ha még nem létezik a servlet a konténerben: betölti az osztályt példányosítja azt inicializálja a servlet-et, az init metódus meghívásával meghívja a service metódust és átadja a kérés és a válasz interfészt megvalósító objektumokat. A konténer megszüntetheti a servlet-et: meghívja a destroy metódusát eldobja a referenciát, a gc-re bízza a takarítást

167 Java Servlet A Web kontextus: a servlet példány számára rendelkezésre álló futásidejű eszközök: nemzetköziesítés paraméterei erőforrás hozzárendelések objektum értékű attribútumok naplózási lehetőségek minden servlet lekérdezheti kontextusát a getservletcontext metódussal a kontextus, nem része a servlet-nek

168 Java Servlet Életciklus események figyelhetők, reagálhatnak komponensek rá: eseményfigyelőt és kezelőosztályt kell írni figyelhető események: web kontextus létrehozás, megszünés, attribútum változás munkafolyamat események kérés Adatok megosztása: JavaBean példányokkal történik Scope: web context, session, request, page

169 Java Servlet Kiszolgáló metódus írása: HTTP servlet esetén dispatcher a HTTPmetódusnak megfelelő nevű taghoz minden kérést egyetlen servlet példány szolgál ki, a service metódust külön szálon hívja a konténer

170 Java Servlet Kérés információk kinyerése: a Service metódus első paramétere egy ServletRequest interfészt megvalósító objektum minden információt tartalmaz a kérésről paramétereket a getparameter() metódussal név alapján kérjük le HTTP servlet esetén, az interfész a HttpServletRequest

171 Java Servlet Válasz előállítása a Service metódus második paraméterea ServletResponse (HttpServletResponse) a getwriter() metódus visszaadja a servlet kimeneti adatfolyamát bináris adatok küldésére a getoutputstream() által adott ServletOutputStream objektumot használjuk a setcontenttype() metódussal beállítjuk a válasz MIME típusát a kimenet pufferelhető: setbuffersize()

172 Java Servlet Kérés továbbítása: a RequestDispatcer objektummal getrequestdispatcher( URL ) include() metódus másik erőforrás beágyazása forward() metódus a kiszolgálás vezérlésének átadása minden esetben a request és response objektumok átadása szükséges

173 Java Servlet Munkamenet (session) kezelés: a konténer automatikusan kezeli a request.getsession() visszaad egy HttpSession interfészt megvalósító objektumot a session attribútumok névvel azonosított objektumok [get set]attribute a session események figyelhetők: HttpSessionBindingListener HttpSessionActivationListener session timeout: [get set]maxinactiveinterval() invalidate() metódus a session megszüntetésére

174 Java Servlet HTTP-Cookie kezelés: Cookie osztály reprezentálja response.addcookie() metódus küldi request.getcookies() metódus adja vissza a kapott Cookie-k tömbjét

175 Java Servlet Java osztály nem final, nem abstract javax.servlet.servlet interface-t implementálja javax.servlet.servlet interface metódusok: init(), getservletconfig(), service(), getservletinfo(), destroy() javax.servlet.genericservlet osztály implementálja a Servlet, ServletConfig és Serializable interfészeket

176 Java Servlet javax.servlet.servletconfig interfész metódusok: getinitparameter(), getservletcontext(), getinitparameternames(), getservletname() A GenericServlet implementálja az interfészeket log() metódust ad hozzá általános célú servlet váz nincs (L7) protokollhoz kötve

177 Java Servlet javax.servlet.http.httpservlet osztály kiterjeszti a GenericServlet osztályt L7 protokollhoz specializált servlet metódusok: dodelete(), doget(), dooption(), dopost(), dotrace(), getlastmodified(), service() a HTTP-metódushoz tartozó default kiszolgáló metódus Bad Request választ ad a service() dispatcher funkciót lát el kiterjesztése többnyire a doxxx() metódusokat definiálja felül

178 Java Servlet - életciklus Példányosítás: constructor hívás Inicializáció init() hívás Kérés kiszolgálás service() hívás 2 paraméterrel: ServletRequest (HttpServletRequest) request objektum ServletResponse (HttpServletResponse) response objektum Leállítás destroy() hívás Megszüntetés: JVM GC

179 Java Servlet package hu.uni_miskolc.iit.webtech; import java.io.*; import java.net.*; import javax.servlet.*; import javax.servlet.http.*; public class Servlet1 extends HttpServlet { } protected void doget(httpservletrequest request, HttpServletResponse response) throws ServletException, IOException { response.setcontenttype("text/html;charset=utf-8"); PrintWriter out = response.getwriter(); out.println("<html>"); out.println("<head>"); out.println("<title>servlet Servlet1</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1>servlet Servlet1 at " + request.getcontextpath () + "</h1>"); out.println("</body>"); out.println("</html>"); out.close(); }

180 Java Servlet - Cookie Fogadott cookie-k: request objektumból: Cookie[] sutik = request.getcookies(); használat: out.println("<hr>cookies:<ul>"); for (int i=0; i<sutik.length; i++) out.println("<li>"+sutik[i].getname()+" : " +sutik[i].getvalue()+"</li>"); out.println("</ul>");

181 Java Servlet - Cookie Küldés: létrehozás Cookie suti = new Cookie("nev", "ertek"); egyéb tulajdonságai: setvalue(), setmaxage(), setdomain(), setpath(), stb. küldés: response.addcookie(suti);

182 Java Servlet Session kezelés Container szolgáltatás Session objektum: hozzáférés HttpSession sess = request.getsession(); metódusok: getattribute(), setattribute(), stb. attribútumai névvel indexelt objektumok perzisztens, alk. szerver cluster fölött osztott Default értékeket a web.xml-ben állíthatunk.

184 Java Server Pages - JSP JSP technológia: szöveg alapú dokumentumok előállítása tartalmaz statikus és dinamikus szakaszokat jelölő nyelv szerver oldali objektumok elérésére lehetőség a jelölő nyelv kiterjesztésére JSP lap tartalma: statikus szakaszok: szöveg (lehet strukturált is, pl. HTML, XML, WML, stb.) dinamikus tartalmat előállító JSP elemek JSP lapok (javasolt) tárolása:.jsp : teljes JSP oldal.jspf : egy JSP oldal részlete

185 Java Server Pages - JSP JSP elemek: feldolgozásra kerülnek dinamikus tartalommal helyettesítődnek típusai: scriptlet: <% %> direktíva: <%@ directive %> standard JSP elem: <jsp:element...> </jsp:element> egyedi JSP elem: <prefix:element...>...</prefix:element> JSP kifejezés: ${ }

186 JSP lapok életciklusa A JSP lap, mint web komponens: kéréseket szolgál ki, servlet-ként elő feldolgozás: servlet forráskód előállítása a jsp szöveg alapján fordítás: server osztály lefordítása kérés kiszolgálás: a servlet életciklusa szerint

187 JSP lapok életciklusa Az elő feldolgozás menete: Java osztály előállítása sablon alapján direktívákkal befolyásolható statikus szakaszok alapján output utasítások generálása scriptlet kódjának átemelése a servlet forrásba kifejezések átadása a JSP kifejezés kiértékelőnek JSP elemek helyén meghívódik az azokat megvalósító osztály megfelelő metódusa

188 Statikus tartalom előállítása Szükséges beállítások: Milyen MIME típus lesz a statikus tartalomból? Milyen kódolású lesz? Milyen a JSP statikus tartalmának kódolása? A kódolást az elő feldolgozó végzi, direktívák alapján: <%@ page contenttype="text/html; charset=utf-8" %> <%@ page pageencoding="utf-8" %> lehet egyetlen page direktívába is írni.

189 Dinamikus tartalom előállítása Java objektumok metódushívásai eredménye képen jön létre. implicit objektumok: létrehozásukról a servlet sablon gondoskodik (pl. pagecontext, param, paramvalues, cookie, stb.) explicit objektumok: scriptlet kódban létrehoztuk, később használhatjuk Objektumok osztott használata: különös gondosságot igényel (több-szálú feldolgozás) <%@ page isthreadsafe="true false" %>

190 Scriptlet használata contenttype="text/html" pageencoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " <html> <head> <title>jsp Page</title> </head> <body> <h2>bart's penalty</h2> <% for (int i=0; i < 100; i++) out.println("i'm not going to use scriptlets this way.<br/>"); %> </body> </html>

191 JavaBean -ek használata contenttype="text/html" pageencoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " <jsp:usebean id="naptar" class="java.util.date"/> <li>nap: <jsp:getproperty name="naptar" property="date"/></li> <li>honap: <jsp:getproperty name="naptar property="month"/></li> <li>ev: <jsp:getproperty name="naptar" property="year"/></li> <li>ora: <jsp:getproperty name="naptar" property="hours"/></li> <li>perc: <jsp:getproperty name="naptar" property="minutes"/></li>

192 JavaBean -ek használata Egy HTML űrlap feldolgozása: <form action="beallit.jsp"> Név: <input type="text" name="nev"/> <br/>szül.év: <input type="text" name="evszam"/> <br/><input type="submit"/> </form>

193 JavaBean -ek használata package csomag; public class peldabean { private int evszam; private String nev; public peldabean() { evszam = 2008; } public int getevszam() { return evszam; } public void setevszam(final int evszam) { this.evszam = evszam; } } public String getnev() { return new String(nev); } public void setnev(final String nev) { this.nev = new String(nev); }

194 JavaBean -ek használata Létrehozzuk a JavaBean-t és felöltjük az űrlap adataival <jsp:usebean class="csomag.peldabean" id="szemely" scope="session"> <jsp:setproperty name="szemely" property="*"/> </jsp:usebean>

195 JavaBean -ek használata Csináljuk valami hasznosat: <jsp:usebean class="csomag.peldabean" id="szemely" scope="session"/> <jsp:usebean id="naptar" class="java.util.date"/> Hello <jsp:getproperty name="szemely" property="nev"/>. Iden <%= naptar.getyear() - szemely.getevszam() %> eves leszel.

196 JSP TagLibrary A JSP elemkészletének kiegészítése JSTL : szabványos elemekkel Custom TagLib: egyedi elemekkel Használata: <%@ taglib prefix="tt" [tagdir=/web-inf/tags/dir uri=uri ] %> <prefix:tag attr1="value"... attrn="value" /> <prefix:tag attr1="value"... attrn="value"> body</prefix:tag> JSTL -ek: Core, XML, Internationalization, SQL, Functions

197 Alternatív szintaxis Két JSP szintaxis használatos: Standard JSP: egyszerű JSP XML-syntax: szabványos XML scriptlet: <jsp:scriptlet>.. </jsp:scriptlet> comment:  direktíva: <jsp:directive.page.. /> kifejezés: <jsp:expression>.. </jsp:expression>

198 Unified Expression Language (EL) A JSP specifikációban definiált leíró nyelv Célja, dinamikusan kiértékelt kifejezések beillesztése a JSP szövegbe. Elemek attribútumába való behelyettesítéshez szükséges. pl. <c:if test="${sessionscope.cart.numberofitems > 0}">...</c:if> Explicit és implicit objektumok hivatkozhatók

199 Implicit objektumok pagecontext: a lap végrehajtási kontextusa, további objektumok elérését szolgálja servletcontext: a lapból generált servlet kontextusa session: a session objektum request: a kérés objektum response: a válasz objektum param: a kérés paramétereinek map-je paramvalues: paraméter értékek tömbje header: http kérés fejrész paraméterek

200 Implicit objektumok headervalues: http kérés fejrész paraméter értékek tömbje cookie: http-cookiek map-je initparam: servlet init paraméterek map-je Változó hatáskör objektumok: pagescope: page hatáskör objektumainak map-je requestscope: kérés hatáskörű objektumok map-je sessionscope: ülés hatáskörű objektumok map-je applicationscope: alkalmazás hatáskörű objektumok map-je

201 Webtechnológiák Répási Tibor egyetemi tanársegéd Miskolc Egyetem,Gépészmérnöki kar, Infomatikai és Villamosmérnöki Tanszékcsoport (IVM) Általános Informatikai Tanszék Iroda: Inf.Int Tel: 2101

202 A Web fejlődése 1989: tudományos közlemények hivatkozási hálója '90-es évek első fele: széleskörű fejlődés '90-es évek második fele: komolyodó üzleti, pénzügyi alkalmazások felülete Hogyan tovább?

203 Célok és akadályok A Web felhasználói felület, de egyedi viselkedésű állapot mentes megjelenítő felület minden eseményt kommunikáció követi minden kommunikáció eredménye egy új dokumentum megjelenése Igény a Web, mint alkalmazás felület kiterjesztése: új szemlélet új technológiák Új elnevezés: Web 2.0 (O'Reilly)

204 Új szemlélet A Web csupán felület, a tartalmat a közösség (felhasználók) szolgáltatáják: pl. iwiw, youtube, Google AdSense, Flickr, BitTorrent, Wikipedia, stb. Átalakul a web használata: személyes weblap --> blog Britannica on-line --> Wikipedia mp3.com --> Napster Akamai --> BitTorrent directory --> tagging hírcsoport --> RSS feed

205 Új technológiák Üzemeltetési: hoszting technológiák storage technológiák Fejlesztési: egységes fejlesztési módszertanok bevezetése (pl. MVC) Megjelenítési: table-less layout design aszinkron webalkalmazás hatékony navigációt segítő akadálymentes web design,

206 Előfutárok Üzemeltetés: Google: progressive storage Fejlesztés: Java Server Faces Megjelenítés: table-less layout design div-elemekkel és CSS-sel aszinkron webalkalmazás: hidden frame, AJAX

207 Aszinkron webalkalmazás Célja, megszüntetni a webalkamazás eseménykezelésének és megjelenítésének szinkronitását. Megjelenítés és kommunikáció egymástól független megoldása. Lehetséges megvalósítás: rejtett IFRAME tartalmának újratöltése JavaScript segítségével a rejtett keret tartalmának felhasználása a megjelenített tartalom változtatására.

208 AJAX Asynchronus Javascript And Xml Nem igazán új technológia, csupán gyűjtőnév. XMLHTTPRequest JavaScript osztály tetszőleges tartalmú (pl. XML) kérést küld aszinkron küldés, fogadás JavaScript változtatja a megjelenített oldalt

209 AJAX Előnyei: sávszélesség kihasználás modell, nézet és vezérlő elkülönítése felhasználói élmény Hátrányai: böngésző integráció ( Vissza gomb!) válaszidő probléma keresőrendszerek felderítése ( deep web ) JavaScript függőség (szabvány hiánya) Web statisztikák

210 AJAX és PHP kapcsolat több fejlesztőkörnyezet is nyújt támogatást AJAX alkalmazások fejlesztéséhez: XAJAX: PHP oldal: include-oldja az xajax.inc.php -t xajax osztály példányosítása függvények regisztrálása függvények implementálása xajaxresponse objektum visszaadása xajax feldolgozó beindítása JavaScript generálás függvények meghívása

211 XAJAX példa multiply.php <?php require("multiply.common.php");?> <html> <head> <title>xajax Multiplier</title> <?php $xajax->printjavascript('../../');?> </head> <body> <input type="text" name="x" id="x" value="2" size="3" /> * <input type="text" name="y" id="y" value="3" size="3" /> = <input type="text" name="z" id="z" value="" size="3" /> <input type="button" value="calculate" onclick="xajax_multiply(document.getelementbyid('x').value, document.getelementbyid('y').value);return false;" /> </body> </html>

212 XAJAX Példa multiply.common.php <?php require_once ("../../xajax.inc.php"); $xajax = new xajax("multiply.server.php"); $xajax->registerfunction("multiply");?>

213 Webes keresőrendszerek XAJAX Példa multiply.server.php <?php function multiply($x, $y) { $objresponse = new xajaxresponse(); $objresponse->addassign("z", "value", $x*$y); return $objresponse; } require("multiply.common.php"); $xajax->processrequests();?>

214 Webes keresőrendszerek A keresés lehetősége egyidős a hipertext ötlettel. Keresés a weben: Nagyon nagy adatmennyiség: nagyon sok olda nagyon gyakori változás sok új oldal adatbázis jellegű keresés igénye hipertext tartalom: többnyire szöveg linkek a szövegben

215 Webes keresőrendszerek Adatbányászat: nagy adatmennyiségek strukturált adatok rejtett összefüggések felderítése Szövegbányászat: adatbányászat kiterjesztése strukturálatlan adatokra osztályozási, klaszterezési feladatok Web-bányászat: szövegbányászat kiterjesztése a web, szemi-strukturált, hipertext-rendszerére

216 Webes keresőrendszerek Keresőmotorok feladatai: feldolgozandó dokumentumok kijelölése dokumentumok letöltése dokumentumok szóhalmazának előállítása dokumentumok metaadatainak előállítása dokumentumok hatákony tárolása keresési adatszótárak nyilvántartása keresésfeldolgozó megvalósítása keresési megaadatok feldolgozása

217 Webes keresőrendszerek Minőségi mérőszámok: pontosság (precision): releváns válaszok aránya válasz dokumentumaihoz felidézés (recall): kiválaszott dokumentumok aránya a releváns dokumentumokhoz tartalomegyezés (exhaustivity): kiválasztott dokumentumok és a keresőkifejezés egyezésének mértke kifejezőerő (power): a leíró kulcsszavak szelektivitásának és hosszának aránya

218 Webes keresőrendszerek eliminálhatóság (eliminalibity): irreleváns dokumentumok felismerhetősége érthetőség (clarity): a kulcsszavak közérthetősége megjósolhatóság (predictability): keresési eredmények előrejelezhetősége

219 Webes keresőrendszerek A keresőmotor felhasználói igényei: széleskörűség: minden fontos weboldalt megtaláhasson naprakészség: az index legyen aktuális, kövesse nyomon a web változásait randsorolás: a lekérdezés által kiválasztott dokumentumok legyenek rangsorolhatóak relevanciájuk szerint megjelenítés: eredmények megjelenítése legyen lényegre törő, informatív és használható

220 Webrobot - begyűjtő Hármas szerep a web kapcsolatrendszerének felderítése dokumentumok letöltése indexelésre indexelt dokumentumok ismételt letöltése Teljes letöltés lehetetlen, a web mérete végtelennek tekinthető. A robotok korlátos erőforrásokat igényelnek, működésüket szabályozni kell.

221 Webrobot - begyűjtő Szabályozó elvek: kiválasztási elv (selection policy): mely dokumentumok töltsük le? újralátogatási elv (re-visit policy): melyik dokumentumot kell újra letölteni? udvariassági elv (politeness policy): milyen hatást gyakorolhat a robot a webre? párhuzamos feldolgozási elv (parallelization policy): párhuzamosan dolgozó robotok összehangolása

222 Webrobot - begyűjtő kiválasztási elv: minden dokumentum tartalmaz linkeket minden link újabb dokumentumot tár fel Melyeket érdemes letölteni? Header-ből kiderül a tartalom típusa, nem szöveges tartalmat nem érdemes Headerek letöltésének csökkentésére vizsgáljuk az URL-t Aratórobot begyűjti a csonkolt URL-ek dokumentumait is relevancia alapú kiválasztás

223 Webrobot - begyűjtő Újralátogatási elv: az index naprakészsége múlik rajta nagyobb index --> több újralátogatás több újralátogatás --> kevesebb új dokumentum az újralátogatási arány igen érzékeny paramétere a keresőrendszernek újralátogatás aging algoritmus alapján: uniform: minden dokumentum egyformán öregszik arányos: dokumentumonként hangolt újralátogatási gyakoriság

224 Webrobot - begyűjtő Udvariassági elv: a robot sokkal gyorsabban olvas, mint az ember a robot nagyon kíváncsi két alapelv: a robot ne okozzon jelentősen nagyobb terhelést egy webszerveren, mint egy ember a weblap gazdájának legyen lehetősége a robotot befolyásolni (robots.txt, HTML fejrész)

225 Webrobot - begyűjtő Párhuzamos feldolgozási elv: több robot --> nagyobb letöltési teljesítmény elosztott robotok --> elosztott hálózati terhelés többes letöltés veszélye a letöltendő URL-eket hozzá kell rendelni a robotokhoz: dinamikus hozzárendelés statikus hozzárendelés

226 Indexelés Kivonatolás: kulcsszavak kinyerése szelektivitás biztosítása Indexstruktúra: indexek hatékony tárolása kulcsszavak hozzárendelése dokumentumokhoz Dokumentum kivonatok tárolása.

227 Keresés feldolgozás Keresési szavakra illeszkedő dokumentumok kiválasztása: logikai kapcsolatok stopszavak szűrése szemantikus kapcsolatok szinomímák kezelése gépelési hibák felismerése finomítható keresés Tucatnyi technika

228 Rangsorolás Kiválasztott dokumentumok rendezése Google PageRank: számítása: kulcsszavak gyakorisága hivatkozások (linkek) fontossága (PR) felkeresési gyakoriság (hitrate) véletlen szörföző modell kiválaszt egy lapot követheti a lap valamelyik linkjét, vagy új lapra ugorhat

229 Deep web a mély háló A mély háló (deep web): közvetlenül el nem érhető sziget dokumentumok dokumentumok lekérdezés eredményeként előállított dokumentumok dinamikusan (AJAX alkalmazásban) előállított dokumentumok Hagyományos robot számára elérhetetlen! Keresőrendszerekben nem kereshető!

230 Ajánlott irodalom Tikk Domonkos (szerk.) Szövegbányászat, Typotex kiadó, 2007

231 Webtechnológiák Répási Tibor egyetemi tanársegéd Miskolc Egyetem,Gépészmérnöki kar, Infomatikai és Villamosmérnöki Tanszékcsoport (IVM) Általános Informatikai Tanszék Iroda: Inf.Int Tel: 2101

232 Java Server Faces Szerver-oldali UI komponens keretrendszer a UI megjelenítése webalkalmazásban JSF összetevők: API a UI komponensek szerver-oldali leképzésére JSP TagLib -ek (core, html) a UI komponensek JSP-be való beillesztéséhez és a szerver-oldali objektumokhoz való kötéshez Közelíti a webalkalmazás fejlesztést a hagyományosnak tekintett MVC módszertanhoz.

233 Java Server Faces Webalkalmazások UI létrehozásához támogatja: a Drop-in komponensek kezelését grafikus IDE funkciók támogatása UI komponens események kötése szerver-oldali kezelőkhöz UI komponens tartalom (adatok) kötése szerveroldali adat-objektumokhoz (JavaBeans) újrahasznosítható és bővíthető UI komponensek UI állapot mentés és visszaállítás lehetősége Ezek mind szokásosak GUI fejlesztésben (pl. Swing)

234 JSF felhasználói felület JSF UI létrehozásának menete: a kérést egy jsp oldal dolgozza fel a UI (myui) megvalósító objektumaira hivatkozik a JSP eseményeket köt az UI objektumokhoz kommunikációról belsőleg gondoskodik (pl. AJAX) a UI objektumok megjeleníthetők a böngésző által ismert formában (HTML)

235 JSF felhasználói felület Előnyei: függetleníti a megjelenítést és a viselkedést függetleníti az alkalmazás logikát a megjelenítéstől (vö. MVC) felépítése egyezik a megszokott UI technológiákkal (pl. swing, mfc,.net, motif, Qt, stb.) nem korlátozódik egyetlen leíró nyelvre sem (HTML független) gazdag környezet komponens állapotok és adatok kezelésére, felhasználói bemenet ellenőrzésre és eseménykezelésre

236 JSF alkalmazások Egy JSF alkalmazás a következőkből áll: JSP lapok halmaza JavaBean-ek halmaza konfiguráció deployment leíró (web.xml) egyedi objektumok (validátorok, konverterek, figyelők, stb.) egyedi JSP elemek halmaza

237 Webtechnológiák Répási Tibor egyetemi tanársegéd Miskolc Egyetem Infomatikai és Villamosmérnöki Tanszékcsoport (IVM) Általános Informatikai Tanszék Iroda: Inf.Int Tel: 2101

238 Webtechnológiák - összefoglalás Fejlesztői keretrendszerek Java EE web-tier: Servlet, JSP, JTL, JSF: szabványos, JSP + JTL megoldás Struts: nyílt-forrású, Servlet API-ra épül PHP: interpretált célnyelv kiterjedt API fél-professzionális megoldás Egyéb: Oracle AS.Net: ASPX Python alapú: pl. Zope

239 Google Web Toolkit Nyílt-forrású AJAX keretrendszer Java nyelv alapú Hatékony fejlesztési és debug lehetőségek Nem GUI keretrendszer (vö. JSF) Webalkalmazások segédkomponenseinek (widget) előállítását szolgálja Két üzemmód: hosted: Java bytekódként fut (plug-in kell) web: tiszta HTML + JavaScript megvalósítás

240 Google Web Toolkit Főbb komponensei: Java-to-JavaScript Compiler: Java forrást képes JavaScript-re fordítani GWT Hosted Web Browser: GWT alkalmazások futtatására alkalmas böngésző (natív JVM) JRE emulation library: JavaScript implementációja a Java API egyes részeinek GWT Web UI class library: előkészített UI komponensek gyüjteménye

241 Google Web Toolkit Tulajdonságai: újrahasznosítható UI komponensek egyszerűsített RPC böngésző history kezelés debug lehetőség JUnit integráció (teszteléshez) böngészők különbözőségeinek feloldása egyszerű többnyelvűség letöltésre optimalizált és cache-elhető JavaScript kód előállítása (az olvashatóság rovására)

242 Webtechnológiák - összefoglalás Felhasználói keretrendszerek számos, előre elkészített funkcionalitású webalkalmazás gyenge együttműködés komplex funkcionalitású tartalomkezelő rendszerek gyenge együttműködés portlet alapú keretrendszerek portlet: egy komplex funkcionalitású portál egy modulja, mely hordozható

243 Tartalomkezelő rendszerek Keretrendszer tartalom kezelésének elősegítésére tartalom: pl. minden olyan információ vagy tapasztalat, mely értékes lehet egy adott célcsoport számára Megkülönböztetünk: Webes tartalomkezelők Nagyvállalati (enterprise) tartalomkezelők

244 Webes tartalomkezelők Tulajdonságai: tartalom tárolása, szerkeszthetőség biztosítása tartalom publikálása, verziókövetése webes megjelenésű testre szabható megjelentés (look&feel) sablon alapú megjelenítés felhasználók és szerepkörök azonosítása jogosultságok odaítélése munkafolyamatok definiálása, betartatása kereső funkciók biztosítása

245 Webes tartalomkezelők Specializált tartalomkezelők Blog lehet személyes vagy tematikus vezércikk alapú hozzászólás támogatása Wiki enciklopédia jellegű egymásra hivatkozó szócikkek gyűjteménye kiemelt keresési funkcionalitás kollaboráció alapú szerkesztés lehetősége

246 Webes tartalomkezelők Általános célú tartalomkezelők szöveg (hypertext), képek, multimédia tartalom tárolására, szerkesztésére, verziókövetésére, publikálására nyújt lehetőséget sablon alapján biztosítja a megjelenítést számos kész termék: Typo3, OpenCMS, Mamboo, Drupal, japs, esettanulmány: OpenCMS (tanszéki Web)

247 ECM Nagyvállalati tartalomkezelés Célja, nagyvállalati de legalább több személy munkafolyamatainak támogatása Szolgáltatásai: naptár: egyéni- és csoporteseményekkel címtár: kapcsolatok kezelésére levelezés: gyakran MUA-ként erőforrás gazdálkodás: eszköznyilvántartás, foglalások, ütemezések projekt tervező: projektek kezelése, ütemtervezés, munkacsomagok kezelése, mérföld kövek, stb.

248 ECM Nagyvállalati tartalomkezelés TTS: gyakran bugtrack mintára, de kiterjesztve egyéni ToDo listák: feladatok kezelése, nyomon követése Dokumentumtár: egyéni és közös dokumentumok tárolása, verziókövetése tudástár: egyfajta zártkörű wiki hírek, események Mindezt gyakran webfelületen hozzáférhető Számos alkalmazás: Lotus Notes, egroupware, GroupWise

249 DAM, MAM (?) Digital Asset Management: digitális eszköznyilvántartás tulajdonképpen az ECM, dokumentum, és egyéb szogláltatásai Media Asset Management: a DAM része, többnyire audiovizuális tartalom kezelésére

250 Folyamat modellek (Petri hálók)

251 Alap folyamatábra modell start stop feldolgozás IO elágazás - Vezérlés menetét mutatja - Programkód orientált - Alacsony szintű - Elemi funkciók - Általános eszköz - elemei : - szekvencia - elágazás - ciklus vezérlési folyam

252 Alap folyamatábra modell start tojás, tej, cukor záp? I kuka stop N összedolgoz habos? N sütőedénybe tesz odaégett? működés? adatok?

253 Petri hálók A modell szerepe: - vezérlési szerkezet, folyamatok struktúráját adja meg - időbeliséget, állapotváltozást is követni tud - párhuzamos, kunkurrens folyamatokat kezel - működési szabályok adhatók meg - matematikai megalapozottság - determinisztikus vagy sztochasztikus működés

254 Petri háló szerkezete: P = (H,T, E, J, A, S, K) H : helyek (elemi állapotok) T : tranzíció (helyek közötti átmenetek) E: élek (hely-tranzíció vagy tranzício-hely) J: tokenek, jelölő elemek A: háló állapota (mely token mely helyen van) S: élek súlyfüggvénye K: háló kezdőállapota

255 Petri háló állapota Megadja a tokenek eloszlását (eloszlás vektor) a helyekre vonatkozólag. A vektor komponense értéke a tartalmazott tokenek darabszáma

256 Petri háló dinamikája Megadott feltételek esetén a tokenek eloszlása megváltozhat, ha erre a tranzíciók lehetőséget adnak Ez a folyamat a tüzelés Tüzelés szabályai: - akkor lehet feltöltött egy tranzíció, ha minden forrásállapotában legalább annyi token van, emennyi az oda vezető él súlya - egy feltöltött tranzíció tetszőlegesen tüzelhet vagy passzív maradhat - a tüzelés során minden forrás helyen csökken a tokenszám az élsúllyal és minden célhelyen nő a tokenszám a bevezető él súllyával Forrás tranzíció (nincs forrás) bármikor tüzelhet Nyelő tranzíció (nincs célhely) bármikor fogadhat

257 Tüzelés

258 Tüzelés

259 Petri hálók mátrix modellje W: tranzíció-hely mátrix helyek tranzíciók: W ij : az i. tranzícióból a j. helyre vezető él előjeles értéke

260 Petri hálók mátrix modellje Tüzelés leírása M : állapotvektor M = M + W T * e M = * M = M =

261 Vezérlési elemek szekvencia, megelőzés p 1 t 1 p 2 t 2 p 3 szinkronizáció t 1

262 Vezérlési elemek t 1 párhuzamosítás t 2 versengés t 1 t 2 t 1 t 2

263 Minta Petri háló (étterem) pincér szabad vendég 1 vendég 2 rendelés rendelés v. várakozás v. várakozás p. nyugtázás fogyasztás kiszolgálás kész konyhába rendelés leadás kiszolgálás fogyasztás főzés T

264 Minta Petri háló (étkező filozófusok) szabad pálcika gondolkodik evőeszköz szabad esznek

265 induló tokenek van tej van egy tojás van edény rendben záp kukába dob vége összedolgoz sütőedénybe tesz adatok finomítása?