web fejleszt s ii
Download
Skip this Video
Download Presentation
Web fejlesztés II.

Loading in 2 Seconds...

play fullscreen
1 / 20

Web fejlesztés II. - PowerPoint PPT Presentation


  • 103 Views
  • Uploaded on

Web fejlesztés II. Illés Zoltán ELTE Informatikai Kar [email protected] 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.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' Web fejlesztés II.' - arama


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.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
web fejleszt s ii

Web fejlesztés II.

Illés Zoltán

ELTE Informatikai Kar

[email protected]

a web programoz s jelent se
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
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
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
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
v lasz jellemz k
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
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
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
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
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
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
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
HTML interaktív elemei IV.
  • File feltöltés
    • <input type=file name=filetolt value=„Tallóz”>
  • Form
    • <form action=mailto:[email protected]>
    • <form action=program method=post v. get Enctype=„multipart/form-data”>
      • Input elemek
    • </form>
form post adatk ld s
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
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
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
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
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
SSI, CGI programeszközei
  • Tetszőleges programozási nyelv (c++)
  • Shell script
  • PHP (Programmable Hypertext Preprocesszor)
  • …és még sokan mások
slide20
Köszönöm a figyelmet!

Illés Zoltán

Budapest, Pázmány Péter sétány 1/c

[email protected]

ad