IX. el˝oad´as: Statikus ´es dinamikus weboldalak, adatb´azisok Hal´acsy P´eter ´es Varga D´aniel
2012. november 4.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
El˝oz˝o ´ora tartalm´ab´ol
Az internet m˝uk¨od´es´et meghat´aroz´o TCP/IP protokollstrukt´ura r´etegesen ´ep¨ul fel Fizikai & adatkapcsolati, h´al´ozati, transzport ´es alkalmaz´asi szinteket k¨ul¨onb¨oztet¨unk meg Ezek tulajdonk´eppen k¨ul¨on-k¨ul¨on megv´alaszthat´oak Wifi h´al´ozaton, TCP protokollal, levelez¨ unk UPC k´abelt´ev´ej´er˝ ol indulva, UDP protokolon, IPTV-t n´ez¨ unk
Alkalmaz´asi szinthez tartoz´o protokollok p´eld´aul: DNS, Telnet, FTP, POP3, SMTP, HTTP
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
IP look-up
N´ezz¨uk meg a saj´at IP c´ım¨unket N´ezz¨uk meg tetsz˝oleges IP c´ımr˝ol, hogy kihez tartozik
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Mir˝ol lesz sz´o?
World Wide Web, a vil´agh´al´o URL HTTP HTML
B¨ong´esz˝o programok Dinamikus weboldalak, adatb´azisok Keres˝omotorok
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
World Wide Web, a vil´ agh´ al´ o
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Mi a World Wide Web? Mi is az a Web? Csak egy a sok protokol, szerver ´es kliensprogram h´armas k¨oz¨ul. wikipedi´ab´ol Miut´an 1989-ben felv´azolta egy az internet ´es a hipertext tulajdons´agait ¨osszekapcsol´ ou ´j tud´ast´ar lehet˝ os´eg´et, Tim Berners-Lee 1990 kar´acsony´ara l´etrehozta a m˝ uk¨ od˝o vil´agh´al´ohoz sz¨ uks´eges ¨osszes eszk¨ozt: az els˝ o webb¨ ong´esz˝ ot (amit WorldWideWeb-nek nevezett el, ´es ami egyben webszerkeszt˝o is volt), az els˝o webszervert (info.cern.ch), ´es az els˝ o weboldalakat, amelyek a projekt le´ır´as´at tartalmazt´ak.
Webb¨ong´esz˝o, browser. A felhaszn´al´o (kliens) g´ep´en fut´o program, ami HTTP-vel kommunik´al a webszerverrel. Ez szolg´alja (serve) ki a k´er´eseket, k¨uldi vissza alap esetben a weboldalakat, a HTML form´atum´u hipertext f´ajlokat. Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
World Wide Web A World Wide Webhez, r¨oviden webhez teh´at az kell, hogy webszerverek a HTTP protokoll seg´ıts´eg´evel HTML form´atum´u dokumentumokat juttassanak c´elba, amik URL form´atum´u hiperlinkekkel mutatnak egym´asra (´es esetlegesen m´as, nem HTML form´atum´u dokumentumokra). Teh´at a h´arom alapvet˝o szabv´any, amire a vil´agh´al´o ´ep¨ul a HTML hipertext oldalakat le´ır´o nyelv, az ezeket az oldalakat az interneten beazonos´ıt´o URL c´ımz´esi szabv´any, ´es az oldalak let¨olt´es´et lehet˝ov´e tev˝o HTTP ´atviteli protokoll. Az els˝ o magyar webszerver: www.fsz.bme.hu (l´ asd: http://www.fsz.bme.hu/www/other h.html)
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
URL Az egys´eges er˝oforr´as-azonos´ıt´o (uniform resource locator, URL) az a c´ımz´esi m´od, ami ahhoz kell, hogy dokumentumokra hivatkozhassunk a neten, ez ´all a HTML f´ajlok hiperlinkjeiben, ez a web alapja. 1994-ben hozz´ak l´etre k´et l´etez˝o konvenci´o o¨sszekapcsol´as´aval: a domain nevek 1985 ´ ota l´etez˝ o szabv´anya (pl. info.cern.ch) a mapp´ak ´es ´allom´anyok el´er´esi u ´tvonal´anak megad´as´at szolg´al´o konvenci´ o, amelyben a perjel (/) szolg´al a mappa- ´es ´allom´anynevek elv´alaszt´as´ara (pl. C:/Dokumentumok/orak 2012 osz/bevinf1213/bevinf1213 9.pdf)
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
URL
Az URL tipikusan h´arom f˝o r´eszb˝ol ´all. Megadja: az el´er´esi protokollt (http), a kiszolg´al´o g´epet (index.hu) a dokumentum kiszolg´al´on bel¨uli hivatkoz´asi c´ım´et (tech/hardver/legh071107) URL-je van minden oldalnak, k´epnek, vide´onak, ami a weben van. Ezt haszn´aljuk az img src-ben, ´es az a href-ben (ezekr˝ol m´eg k´es˝obb lesz sz´o).
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Mi az URL-ben a ? jel.
Az URL-ek n´eha nagyon hossz´uak ´es ? & jelek vannak a v´eg´en. Ezek alapesetben az u˝rlapokba be´ırt, kiv´alasztott ´ert´ekek Vagy b´armilyen param´eterek Nem mind sz¨uks´eges felt´etelei a megfelel˝o v´alasz meg´erkez´es´enek http://www.google.com/search ?client=ubuntu&channel=fs&q=csokol´ ad´ e&ie=utf-8&oe=utf-8
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Mi´ert szerepel a www el˝otag a webc´ımekben?
annak a kor´abbi konvenci´onak az eredm´enye, amely alapj´an az internet szervereket az alapj´an nevezik el, amilyen szolg´altat´ast biztos´ıtanak ennek megfelel˝oen a webszerverek gyakran a www megnevez´est kapj´ak, ahogy az ftp p´eld´aul az FTP szerverek elnevez´ese (de ezek nem szigor´u szab´alyok, csak konvenci´ok, az URL els˝o eleme r¨ogz´ıti, hogy milyen protokoll seg´ıts´eg´evel kell kommunik´alni)
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Web 6= Net
Az eddigiek alapj´an m´ar vil´agos lehet, de kihangs´ulyozzuk: A World Wide Web ´es az internet nem szinonim´ak. A WWW csak az egyik alkalmaz´as az interneten haszn´alt sok tucatnyi k¨oz¨ul. (Levelez´es, f´ajlcsere, stb.) K¨or¨ulbel¨ul 30 ´evvel az internet ´es az e-mail ut´an sz¨uletett. A WWW a ma legelterjedtebb, a gyakorlatban legfontosabb alkalmaz´as a neten.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Mi´ert lett olyan sikeres a WWW? I. Fogalmi-technol´ogiai u´jdons´ag: A hipertexttel o¨sszekapcsolt tud´ast´ar elk´epzel´ese a hatvanas ´evek olyan projektjeihez k¨ot˝odik, mint Ted Nelson Project Xanadu-ja, ´es Douglas Engelbart oN-Line System-je (NLS), ´es ezek pedig a Vannevar Bush ´altal 1945-ben felvetett mikrofilm alap´u memex-b˝ol mer´ıtettek ihletet Fontos u´j´ıt´as volt a kor´abbi k´etir´any´u hiperlink koncepci´okhoz k´epest, hogy a web egyir´any´u kapcsolatok (linkek) l´etrehoz´as´are ´ep¨ul Ennek az u´j´ıt´asnak az egyik eredm´enye a halott linkek jelenl´ete a weben
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Mi´ert lett olyan sikeres a WWW? II. Jogi-gazdas´agi okok: a World Wide Web szabad szabv´any a web kezdeti id˝ oszak´aban m´eg egy m´asik protokoll, a Gopher volt a meghat´aroz´ o a webes tartalmak beazonos´ıt´asa ´es keres´ese kapcs´an 1993 febru´arj´aban a Gopher protokoll tulajdonosa a University of Minnesota bejelentette, hogy licencd´ıj fizet´es´ehez k¨oti a Gopher szerverek haszn´alat´at, ´es b´ar k´es˝ obb azt´an a Gopher-t a GNU GPL licenc alatt tett´ek u ´jra k¨ ozz´e, akkor m´ar r´eg a web volt a meghat´aroz´ o megold´as az online inform´aci´ o beazonos´ıt´as´ara ´es keres´es´ere A gyors v´alt´as r´eszben annak k¨ osz¨ onhet˝ o, hogy 1993 ´aprilis´aban a CERN bejelentette, hogy a World Wide Web ingyenesen haszn´alhat´ o szabv´any A v´alt´ast el˝ oseg´ıtette a World Wide Web k¨ otetlenebb form´atuma ´es a keres´esi paradigm´akban bek¨ ovetkezett v´altoz´as (err˝ol m´eg a keres˝ omotorokn´al r´eszletesebben besz´el¨ unk) Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
A vil´agh´al´o egy r´eszlete
k´ ep forr´ asa: https://secure.wikimedia.org/wikipedia/en/wiki/World Wide Web Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Mi kell ahhoz, hogy weboldalunk legyen? Kell egy internetre k¨ot¨ott sz´am´ıt´og´ep, webszerverrel Egyetemen mindenkinek lehet, l´asd http://www.hszk.bme.hu/. Ingyenes t´arhelyszolg´altat´ on´al regisztr´alunk Internet el˝ofizet´eshez sokszor adnak T´arhelyszolg´altat´ on´al b´erel¨ unk helyet
el kell k´esz´ıteni a HTML oldalakat, k´epeket erre kifejlesztett programokkal, vagy halad´o geekek egyszer˝ u sz¨ ovegszerkeszt˝ovel
Fel kell t¨olteni. Ma m´ar gyakran egy blogszolg´altat´on´al vagy k¨oz¨oss´egi oldalon k´esz´ıtenek a felhaszn´al´ok maguknak oldalt
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP belseje
Ez is csak egy k´er´es-v´alasz alap´u protokoll K´erem err˝ol a host-r´ol az adott c´ımen l´ev˝o er˝oforr´ast. P´eld´aul: GET /assets/images/index logo.gif HTTP/1.1 Szerver v´alasz´aban megadja, hogy mit fog k¨uldeni: mime-type vagy content-type (tartalomt´ıpus) ´ az adatot. Es
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
A k¨ovetkez˝o p´eld´aban haszn´alt protokoll a Telnet A Telnet a legegyszer˝ubb protokoll, ami l´etezhet: nem csin´al semmit, csak b´ajtot k¨uldd ´es fogad. R´egen ezt haszn´alt´ak t´avoli el´er´esre. Telefonon, c´eghez bet´arcs´az´os vonalon telnet t´avmunka m´ar 30 ´eve volt. Viszont lehallgathat´o, mint a ny´ılt wifi is (ez´ert ma m´ar ink´abb a biztons´agosabb SSH protokollt haszn´aljuk helyette t´avoli g´epekre val´o bel´ep´eshez) Telnet protokollal tudunk k´ezzel (processinggel) levelet k¨uldeni, html oldalt let¨olteni, stb.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP m˝uk¨od´ese
$ telnet index.hu 80 Trying 217.20.131.2... Connected to index.hu. Escape character is ’^ ]’. GET / HTTP/1.1 Host: index.hu Connection: Close
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP m˝uk¨od´ese
$ telnet index.hu 80 Trying 217.20.131.2... Connected to index.hu. Escape character is ’^ ]’. GET / HTTP/1.1 Host: index.hu Connection: Close
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP m˝uk¨od´ese
$ telnet index.hu 80 Trying 217.20.131.2... Connected to index.hu. Escape character is ’^ ]’. GET / HTTP/1.1 Host: index.hu Connection: Close
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP m˝uk¨od´ese
$ telnet index.hu 80 Trying 217.20.131.2... Connected to index.hu. Escape character is ’^ ]’. GET / HTTP/1.1 Host: index.hu Connection: Close
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP v´alasz
HTTP/1.1 200 OK Date: Thu, 08 Nov 2007 07:48:12 GMT Server: Apache/2.0.54 (Debian GNU/Linux) mod_fastcgi/2. X-Powered-By: PHP/5.0.5-Debian-0.8~sarge1 Cache-Control: max-age=300 Expires: Thu, 08 Nov 2007 07:53:12 GMT Connection: close Transfer-Encoding: chunked Content-Type: text/html ´ a HTML file j¨on itt. Es
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
N´eh´any sz´o m´eg a HTML-r˝ol Mi tud? Form´azott sz¨oveget t´arolni K¨ ul¨onb¨oz˝o st´ılus´ u bet˝ uket, jeleket. Dobozokat, t´abl´azatokat Felsorol´asokat, fejl´eceket
˝ Urlapokat kezelni (textbox, list, button) Sokf´ele m´ediaf´ajlt tud be´agyazni hivatkoz´as seg´ıts´eg´evel: ak´ar m´asik g´epr˝ol is Hiperlinkeket tartalmazhat: valamire r´ab¨ok¨unk egy m´asik URL-re ugrik
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTML ´es a k´epek
HTML f´ajl (hipertext markup language) egy sz¨ovegf´ajl, kis form´az´assal Nem lehet benne k´ep besz´urva Csak hivatkoz´as r´a:
H´any HTTP k´er´es van minimum egy 5 k´epet tartalmaz´o HTML oldal bet¨olt´es´en´el?
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
A hiperlink A HTML-dokumentumokban hiperlinkek (r¨oviden linkek) lehetnek. A link lehet˝ov´e teszi, hogy a dokumentum olvas´oja ´atugorjon egy m´asik dokumentumra, ...vagy ak´ar egy dokumentum valamelyik kijel¨olt szakasz´ara, ...majd vissza. Legink´abb a lexikonok ´es tudom´anyos cikkek hivatkoz´asaihoz hasonl´ıt, de ahelyett, hogy el kellene mennyi a hivatkozott sz¨oveg´ert a k¨onyvt´arba, csak r´a kell klikkelni. Ez forradalmi v´altoz´as a sz¨oveg-befogad´as m´odj´aban, nem v´eletlen¨ul ´ırt´ak a hiperlinkr˝ol lelkendez˝o essz´ek tucatjait. Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
A hiperlink, egy p´elda
A hiperlinkek elhelyez´es´enek a szintaktik´aja HTML-ben:
tartalom, amihez a linket k¨ otj¨ uk lehet sz¨ oveges elemhez hiperlinket kapcsolni:
index.hu de ak´ar k´ ephez is:
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
B¨ ong´ esz˝ o programok
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
B¨ong´esz˝o Hi´aba a webszerver, a HTML oldal ´es az URL, ha nincs, ami a szolg´altatott tartalmat a felhaszn´al´o g´ep´en megjelen´ıtse. Ezt a feladatot a b¨ong´esz˝o l´atja el. A legelterjedtebb b¨ong´esz˝oprogramok: MS Internet Explorer: A Windows oper´aci´os rendszerekhez mell´ekelt b¨ong´esz˝o Mozilla Firefox: N´epszer˝u, szinte minden oper´aci´os rendszeren m˝uk¨od˝o b¨ong´esz˝o (ny´ılt forr´ask´od´u) Google Chrome: A Google ´altal fejlesztett b¨ong´esz˝o (r´eszben ny´ılt forr´ask´od´u) Opera: B´ar vannak olyan orsz´agok, ahol ez a legn´epszer˝ubb b¨ong´esz˝o asztali g´epeken, nemzetk¨ozi sikert a mobil b¨ong´esz˝ok piac´an ´ert el Safari: A Mac OS X oper´aci´os rendszerhez mell´ekelt b¨ong´esz˝o Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
B¨ong´esz˝ohaszn´alat megoszl´as´anak alakul´asa
K´ ep forr´ asa: https://en.wikipedia.org/wiki/Browser usage share Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Plugin
A b¨ong´esz˝o nem minden m´ediaform´atumot tud megjelen´ıteni. A b¨ong´esz˝oh¨oz let¨olthet˝o kis programok, u´n. be´ep¨ul˝o modulok (plugin) feladata leggyakrabban az, hogy valamilyen form´atum megjelen´ıt´es´ere alkalmass´a tegy´ek a b¨ong´esz˝ot. P´eld´ak ilyenekre: Flash, Quicktime, PDF.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
B¨ong´esz˝o kieg´esz´ıt´es
Van egy m´asik m´odja is, hogy kis programok m´odos´ıts´ak a b¨ong´esz˝o m˝uk¨od´es´et. Ezek neve kieg´esz´ıt´es (extension). Ezt a m´odszert f˝oleg a Mozilla Firefox b¨ong´esz˝o alkalmazza. T¨obb ezer hasznos ´es kev´esb´e hasznos kieg´esz´ıt´es l´etezik hozz´a, a rekl´am-letilt´ot´ol a folyamatos id˝oj´ar´asjelent´esig.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Szabv´anyok
A HTML egy szabv´any, mire mit kell megjelen´ıteni. A b¨ong´esz˝oprogramok fejleszt˝oi azonban nem mindig mindent a szabv´any szerint csin´alnak. ´ Eppen a legelterjedtebb, az Internet Explorer t´er el a legt¨obb helyen a szabv´anyt´ol. N´eh´any ´eve m´eg sok olyan szab´alytalan weboldal volt, amit csak az Explorer tudott megjelen´ıteni, ma m´ar szerencs´ere egyre kevesebb.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP/Web/browser Cookie Az a baj az eddig megismert HTTP-vel, hogy senki nem tudja megjegyezni, hogy mi volt ezel¨ott Egy olyan besz´elget´es, amiben egyik mondat sem hivatkozhat az el˝oz˝ore Megold´as a s¨uti (HTTP-s¨uti, avagy b¨ong´esz˝os¨uti, avagy webs¨uti), ami egy kis sz¨oveges adatcsomag (nem tartalmazhat programk´odot) amit a szerver k¨ uld a b¨ ong´esz˝ onek, ahol a s¨ utik hosszabb-r¨ovidebb ideig t´arol´asra ker¨ ulnek ´es amiket a b¨ ong´esz˝ o is vissza tud k¨ uldeni a szervernek
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
HTTP-s¨utik el˝onyei ´es vesz´elyei El˝ onye, hogy lehet˝ov´e teszi: adott oldal egy-egy l´atogat´as´anak, vagy folytat´olagos munkamenetek menedzsel´es´et (p´eld´aul online bev´as´arl´okos´ar tatalm´anak kezel´es´et) a szem´elyreszab´ast a nyomonk¨ovet´est Vesz´ elyek: a s¨utik alkalmazhat´oak felhaszn´al´okr´ol val´o adatgy˝ujt´eshez a s¨utik ´es a benn¨uk t´arolt tartalom ellophat´o a s¨utik, ha nicsenek titkos´ıtva, lehallgathat´oak
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Flash s¨utik (Local Shared Objects)
HTTP s¨utihez hasonl´o, DE: nem a b¨ong´esz˝ o fel¨ ugyeli a t´arol´as´at ´es t¨orl´es´et egy oper´aci´os rendszer alatt fut´ o t¨ obb k¨ ul¨onb¨oz˝o b¨ong´esz˝o tev´ekenys´ege k¨ oz¨ ott is k´epes kapcsolatot teremteni
Firefox haszn´alata eset´en p´eld´aul a BetterPrivacy kiterjeszt´essel tudunk ellene v´edekezni
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Dinamikus weboldalak, adatb´ azisok
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Dinamikus tartalom
Legegyszer˝ubb esetben a webszerver a HTTP k´er´esre visszaad egy a merevlemez´en el˝ore let´arolt HTML form´atum´u oldalt. Ez m´eg ma is el˝ofordul, de ma m´ar sokkal gyakoribb, hogy a webszerver a k´er´esre v´alaszul helyben ´all´ıtja el˝o a HTML oldalt. Egyszer˝u esetben ilyenkor egy HTML sablont egy adatb´azisb´ol t¨olti fel adatokkal. ´Igy napra- vagy ak´ar m´asodpercre k´esz adatokat tud szolg´altatni, illetve szem´elyre tudja szabni a szolg´altat´ast.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Nagyon dinamikus tartalom
Egy modern web-alkalmaz´as u´gy m˝uk¨odik, hogy a webszerver g´epen egy bonyolult program fut, amely felel˝os a felhaszn´al´ok fel´e k¨uld¨ott weboldalak tartalm´a´ert, ´es ak´ar o¨sszetett sz´am´ıt´asokat is elv´egez a k´ıv´ant HTML oldal legy´art´as´ahoz.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Adatb´azisok A sz´am´ıt´astechnik´aban, az inform´aci´o feldolgoz´asban nagyon fontos szoftverek az adatb´aziskezel˝ok: K´epzelj¨unk el egy Excel t´abl´at, ami p´ar milli´o sorb´ol ´all Ebben nagyon gyorsan tudunk keresni ´es sz˝urni egy oszlopra Egyszerre t¨obb t´abl´azatot tudunk o¨sszekapcsolni neptunk´od awspf4gd88 dkrt9x220d yz8clvvg32
Hal´ acsy P´ eter ´ es Varga D´ aniel
kurzusk´od BMEGT431254 BMEGT431254 BMETT982321
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Tipikus dinamikus web-alkalmaz´as ma
Fogadja a k´er´est a felhaszn´al´ot´ol. Ennek megfelel˝o adatokat kikeresi az adatb´azisb´ol. ¨ Ossze´ all´ıt egy HTML oldalt, amit visszak¨uld. A felhaszn´al´o kit¨olt egy u˝rlapot, vagy kiv´alaszt valamit egy list´ab´ol. Ennek megfelel˝oen a szerveren a program valamit m´odos´ıt az adatb´azisban. Esetp´elda: iWiW ismerem, Facebook like, Neptun t´argyfelv´etel
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
egy dinamikus web-alkalmaz´as
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
JavaScript
A Netscape, az els˝o igaz´an elterjedt b¨ong´esz˝o k´esz´ıt˝oi vezett´ek be a JavaScript-et, aminek ma m´ar ECMAScript a hivatalos neve. Ez egy programoz´asi nyelv, ami lehet˝ov´e teszi, hogy a weboldal programokat futtasson, ´es ezek megv´altoztass´ak mag´at a weboldalt is, ´es mindezt a kliens oldalon, an´elk¨ul, hogy k¨ozben a webszerverrel k´ene kommunik´alni.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
JavaScript Hello World program
simple page <script type="text/javascript"> document.write(’Hello World!’); <noscript>
Your browser either does not support JavaScript, or you have JavaScript turned off.
Forr´ as: https://secure.wikimedia.org/wikipedia/en/wiki/Javascript
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
AJAX - Aszinkron JavaScript & XML A JavaScript lehet˝ov´e teszi, hogy a weboldal a b¨ong´esz˝oben mindenf´ele okosat csin´aljon a webszerver n´elk¨ul is. De persze m´eg okosabb dolgokat tud csin´alni, ha a JavaScript programnak van m´odja a webszerverrel is kommunik´alni, annak k´erd´eseket feltenni. Ennek k¨ul¨on el˝onye, hogy nem kell minden klikkel´es ut´an megv´arni, hogy az ablak ki¨ur¨ul, majd u´jra ben´epesedik: Az AJAX hasznoss´ag´ara j´ o p´elda a Google Mail szolg´altat´asa. (k¨ ov. ´abra)
A HTML5 szabv´anyn´al kor´abbi szabv´anyt haszn´al´o b¨ong´esz˝ok eset´en az AJAX p´eld´aul rosszul m˝uk¨odik egy¨utt a n´epszer˝u, sokat haszn´alt Vissza gombbal. Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Google suggest
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Flash
Hamar megjelent az ig´eny arra, hogy vizu´alisan gazdag, dinamikus, interakt´ıv tartalmak is lehessenek a weben. Erre a HTML alkalmatlan, ´es ma m´eg az AJAX-f´ele foltoz´asok ut´an sem igaz´an megfelel˝o. Az u˝rt a Macromedia c´eg Flash nev˝u alkalmaz´asa/adatform´atuma t¨olt¨otte be. A Flash tartalom interakt´ıv ´es dinamikus, ´es be´agyazhat´o egy weboldal belsej´ebe. A be´agyaz´as k´enyszermegold´as, r´eszleges integr´aci´o, p´eld´aul nem mindig lehet eg´errel kijel¨olni a Flash-en bel¨uli sz¨oveget, vagy megnagy´ıtani a bet˝um´eretet.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Flash mint m´edialej´atsz´o
A Flash alkalmaz´ast fejleszt˝oi n´eh´any ´eve alkalmass´a tett´ek m´edialej´atsz´asra. Teh´at ahelyett, hogy a felhaszn´al´onak valamilyen vide´oform´atum lej´atsz´oj´at kellene install´alnia, megkaphatja a lej´atsz´oprogramot Flash-ben a weboldalba ´agyazva. Ezen az elven m˝uk¨odik p´eld´aul a youtube.com.
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Keres˝ omotorok
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Keres˝ok ´es c´ımt´arak
A web h˝oskor´aban nem l´eteztek keres˝ok Csak egyik oldalr´ol a m´asikra mehett¨unk Az els˝o keres˝ok hierarchikus ´es emberek ´altal karbantartott f´ajlrendszerekre ´es c´ımt´arakra ´ep¨ultek (pl. a Gopher protokollra ´ep¨ul˝o keres˝ok) A Yahoo! is c´ımt´ar´aval (http://dir.yahoo.com/) lett sikeres, amir˝ol csak 2002-ben t´ertek ´at crawler alap´u keres´esb˝ol sz´armaz´o eredm´enyek felt¨untet´es´ere
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Keres˝ok fel´ep´ıt´ese Crawling: let¨oltj¨uk a webet, folyamatosan. A Google 100 milli´ard weboldalt t´arol Index: sz´o-weboldal t´abl´azat Search: az indexet haszn´al´o program Ranking: rangsorol´as — kulcssz´o: keres˝ore optimaliz´al´as Google egyik nagy u´j´ıt´asa a PageRank rangsorol´as volt: az oldalakat a r´ajuk mutat´o linkek sz´ama ´es azok fontoss´aga szerint rangsorolja A l´athatatlan h´al´o (invisible web) avagy m´ely h´al´o (deep web) a vil´agh´al´o azon r´esze, amely nem szerepel a keres˝omotorok ny´ılv´antart´asaiban
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Google PageRank
K´ ep forr´ asa: https://secure.wikimedia.org/wikipedia/en/wiki/Pagerank Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok
Internet Archive ´es a Wayback Machine
Mi´ert ne ments¨uk le a web tartalm´at rendszeresen, annak ´erdek´eben, hogy visszakereshet˝o legyen, hogy mi volt fenn mikor http://www.archive.org/web/web.php
Hal´ acsy P´ eter ´ es Varga D´ aniel
IX. el˝ oad´ as: Statikus ´ es dinamikus weboldalak, adatb´ azisok