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

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. 108. Tel: 2101

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 http://www.iit.uni-miskolc.hu/iitweb/opencms/users/repasit/webtech/ Ü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)!!!

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

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.

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

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.)

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. http:// domain név vagy IP cím, pl. users.iit.uni-miskolc.hu ösvény, pl. /~repasi pl. http://users.iit.uni-miskolc.hu/~repasi

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

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

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.

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.

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

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

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.

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ő)

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.

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.

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.

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)

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>

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

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

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

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>

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

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.

HTML + CSS példa <!DOCTYPE html PUBLIC "- //W3C//DTD XHTML 1.1//EN" "http://www.w3.org/tr/xhtml11/ 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 }

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 szelektorok: @media print screen print,screen

Referenciák, tutoriálok www.w3schools.com www.w3c.org

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?

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!

Ü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

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

Egy forgatókönyv Böngészőbe beírtuk a http://users.iit.uni-miskolc.hu/~repasi/ 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

Egy forgatókönyv 2 Szerver válasza: HTTP/1.1 200 OK Date: Tue, 19 Feb 2008 12:19:16 GMT Server: Apache/2.0.54 (Debian GNU/Linux) mod_jk2/2.0.4 PHP/4.3.10-22 mod_ssl/2.0.54 OpenSSL/0.9.7e Last-Modified: Mon, 15 Mar 2004 12:58:20 GMT ETag: "247db87b-310-929f300" Accept-Ranges: bytes Content-Length: 784 Content-Type: text/html Státusz kódok 100-199: informális üzenetek 200-299: sikeresség 300-399: átirányítás 400-499: ideiglenes hiba 500-599: fatális hiba

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/1.1 200 OK Date: Tue, 19 Feb 2008 12:47:43 GMT Server: Apache/2.0.54 (Debian GNU/Linux) mod_jk2/2.0.4 PHP/4.3.10-22 mod_ssl/2.0.54 OpenSSL/0.9.7e Last-Modified: Mon, 15 Mar 2004 12:58:20 GMT ETag: "247db87b-310-929f300" Accept-Ranges: bytes Content-Length: 784 Content-Type: text/html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> <HTML>...

Ö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

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

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.

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ő.

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.)

Űrlap adatok feldolgozása Speciális lehetőség: action= mailto:<email 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!

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

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)

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ő

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

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.

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.

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

Document Object Model - DOM

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' />

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>

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

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>

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>

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= "http://w3schools.com" parent.document.getelementbyid("rightframe"). src= "http://google.com" } </script> </head> <body> <a href= # onclick="newsrc()">link</a> </body> </html>

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>

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>

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ó)

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

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>

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)

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

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

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

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.

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)

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?

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

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

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

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)

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

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

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

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)

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)

HTTP-Cookie Kérés: GET /index.html HTTP/1.1 Válasz, cookie beállítás: HTTP/1.1 200 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: */*

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.

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

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

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

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

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

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

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.

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

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.

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)

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

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

Folyamat modellezés Másik slideshow

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

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!)

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

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

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

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

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 2 1997 PHP 3: izraeli továbbfejlesztés, PHP: Hytertext Preprocessor (megjelenés 1999) 2000 PHP 4: Zend Engine 1.0 2004 PHP 5: OOP kiegészítés

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?>

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

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

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

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.

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

Ű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.

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

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.

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

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.

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

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)

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);?>

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!)

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

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

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>

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

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>";?>

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

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

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

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);

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 1997 05: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");

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);?>

Tanszéki PostgreSQL Regisztráció: http://www-db.iit.uni-miskolc.hu e-mail 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';

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

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

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!

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

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

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!

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!

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.

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.

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

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

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

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ő!

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ó.

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

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.

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.

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

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.

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!

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

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

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

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ő

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

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

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

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.)

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

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

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

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.

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

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.

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

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

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

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

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

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

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()

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

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

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

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

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

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

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

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(); }

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>");

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);

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.

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

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: ${ }

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

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

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.

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" %>

Scriptlet használata <%@page contenttype="text/html" pageencoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/tr/html4/loose.dtd"> <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>

JavaBean -ek használata <%@page contenttype="text/html" pageencoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/tr/html4/loose.dtd"> <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>

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>

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); }

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>

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.

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

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>

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

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

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

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. 108. Tel: 2101

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?

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)

Ú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

Ú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,

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

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.

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

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

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

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>

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

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();?>

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

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

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

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

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

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ó

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.

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

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

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

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)

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

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.

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

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

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ő!

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

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. 108. Tel: 2101

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.

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)

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)

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

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

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. 108. Tel: 2101

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

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

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

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)

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ó

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

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

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

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)

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.

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

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

Folyamat modellek (Petri hálók)

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

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?

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

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

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 1 0 1 0 0 2 0 1

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

Tüzelés 1 1 1 2 1 2

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

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

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

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

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

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

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?

Minta Petri háló (adatok küldése két processz között)