Illés Zoltán ELTE Informatikai Kar zoltan.illes@elte.hu Web fejlesztés II. Illés Zoltán ELTE Informatikai Kar zoltan.illes@elte.hu

A Web programozás jelentése Statikus oldalak hiányosságai Kliens-Szerver együttműködés Kliens Pull, szerver push Interaktív HTML elemek Kliens programok Szerver oldali programok SSI, CGI

Félévi tematika HTML interaktív elemek SSI, CGI jelentése,használata Javascript http://developer.mozilla.org/en/docs/JavaScript/ http://developer.mozilla.org/en/docs/DOM/ Shell script PHP http://www.php.net AJAX http://developer.mozilla.org/en/docs/AJAX/

HTTP protokoll RFC 2068 - HTTP 1.0, 1990 RFC 2616 - HTTP 1.1, 1999 Letölthető: www.w3.org http://www.w3.org/Protocols/rfc2616/rfc2616.html Default TCP port: 80 HTTP üzenet: Kérés vagy Válasz A kérés, válasz formátumok azonosak Formátum: fejlécsor(ok) CRLF törzs Kérés fejléc felépítése: Típus(GET,HEAD,stb) SP URI SP [HTTP version] Kérés fejlécek közt a Host fejlécsor használata gyakori. A válasz fejlécsor felépítése: HTTP version SP Status Code SP Status szöveg

Kliens szerver együttműködés Egy kliens program(jellemzően böngésző) a 80-as TCP portra küld egy http kérést Böngésző címsorban adott oldal megadás (http, https, ftp) HTML oldal egy eleme (form) kérést küld Szerver HTTP kiszolgáló elküldi a válaszlapot Elindít egy programot, aminek eredményét, mint válaszlapot küldi el. Elindít egy vagy több programot ami(k)nek eredménye a válaszlap része

Válasz jellemzők HTTP szerver verzió Válasz státuszkódja (200=OK, stb.) 300-as kódcsoport, kliensnek valamit tenni kell még 400-as kódcsoport, hiba 500-as kódcsoport, szerver hiba Válasz fejléc, kódhoz tartozik Pl. 401, jelszó kell, kérjen a kliens és küldje el a WWW-Authenticate fejléccel megadott módon Tartalom Fejlécsor(ok)(Content-Type: text/html ) CRLF HTML oldal

HTTP kapcsolat példa telnet parancs kiadása Set crlf // return==CR&LF, nem fontos o gépnév 80 ; port szám:80 GET / HTTP/1.1 ; fődokumentum Host: gépnév A telnet miatt a HTTP/1.1 verzió adat nem kell(het). CRLF … Válasz Természetesen akár a putty terminál kliens is használható. A http protokoll verziószám IIS esetén nem kell.

Kliens Pull tartalomcsere A html oldal tartalmaz egy frissítési utasítást (refresh) <meta http-equiv=refresh Content=„4;URL=másikcím > http://maxim.inf.elte.hu/~illes/hajra.html

Szerver push tartalomfrissítés A szerver gépen a választ adó program, több oldalt küld, egymás után. Content-type= multipart/x-mixed; boundary=elvalasztas --elvalasztas Szabályos html oldal --elválasztás Újabb szabályos oldal Stb. --elvalasztas– (vége)

HTML interaktív elemei I. Input elem <input type=típus name=..value=..size=..> type=text Readonly paraméter type=hidden type=password

HTML interaktív elemei II. <input type=button name= …> <button> Alma </button> <input type=submit ….> <input type=reset value=„Mégse”> <input type=radio……checked> <input type=checkbox …. checked> <input type=image src=filenév …>

HTML interaktív elemei III. Szövegterület mező <textarea name=velemeny rows=3 cols=50> Írj ide valamit…. </textarea> Select (választó) elem <select name=ar size=5 multiple> <option value=100> 100 Ft. <option value=200> 200 Ft. … </select>

HTML interaktív elemei IV. File feltöltés <input type=file name=filetolt value=„Tallóz”> Form <form action=mailto:alma@jonatan.hu> <form action=program method=post v. get Enctype=„multipart/form-data”> Input elemek </form>

Form Post adatküldés Post A form összes input adata a feldolgozó program std. input-jára kerül. Az adatokat az & jel köti össze. .,?,!,+,stb. kódolva (%xx), hexa formában Az adatok a HTTP kérés törzsében!!! utaznak Példa: POST /program.php HTTP/1.1 Host: almafa.elte.hu …ez egy üres sor…. alma=golden&barack=sárga

Form GET adatküldés Get QUERY_STRING környezeti változóba kerül az adat Ez az adat a böngésző címsorában is látszik http://almafa.elte.hu/program.php?alma=golden&barack=sárga Ez a HTTP 1.1 alapján az alábbi kérésnek felel meg: POST /program.php?alma=golden&barack=sárga HTTP/1.1 Host: almafa.elte.hu

Legfontosabb környezeti változók REQUEST_METHOD (Get,Post) REMOTE_ADDR Kérést küldő gép ip. Címe (a.b.c.d) REMOTE_HOST Kérést küldő gép neve (valami.elte.hu) HTTP_USER_AGENT A kérést küldő böngésző típusa

SSI, Server Side Include Nem készít teljes html oldalt <!--#parancs név=érték --> Parancsok száma erősen kiszolgálófüggő <!--#include file=„alma.txt” --> Irix-en a file név relatív!! <!--#exec cmd=„parancsnév” --> Az irix-en a parancsnév teljes név!! A HTML oldalon is van X jog! #!/usr/bin/sh Példa: ssi.htm

CGI, Common Gateway Interface Nem programozási nyelv Teljes oldal küldés Kliens->szerver közötti adatátadás módja(karakteres adatcsere)(get,post) Kötelező tartalomleíró fejlécsort küldeni A fejlécsor(ok) után üres sort is kötelező küldeni (RFC 2616) Irix-en az action értéke relatív név, kiterjesztése cgi vagy pl.

SSI, CGI programeszközei Tetszőleges programozási nyelv (c++) Shell script PHP (Programmable Hypertext Preprocesszor) …és még sokan mások

Budapest, Pázmány Péter sétány 1/c Köszönöm a figyelmet! Illés Zoltán Budapest, Pázmány Péter sétány 1/c Zoltan.Illes@elte.hu