1 / 20

Web fejlesztés II.

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.

arama
Download Presentation

Web fejlesztés II.

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


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

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

  3. 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/

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

  5. Kliens szerver együttműködés • Kliens • 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

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

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

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

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

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

  11. 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 …>

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

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

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

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

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

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

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

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

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

More Related