WEB Technológiák A HTML és a CGI ME Általános Informatikai Tsz. dr. Kovács László
2 A HTML nyelv Hypertext Markup Language, az SGML (Standard Generalized Markup Language, spec. jelölőrendszert használó nyelv kialakításának szabványa 1986 óta) egyik megvalósítása Olyan jelölőnyelv, melynek segítségével platform- független dokumentumok hozhatók létre. A HTML szintaxisának formális leírása: HTML DTD Nem programozási nyelv! A szöveges dokumentum különböző helyein tag-eket v. karakterhelyettesítőket (character entity references) helyezünk el, amellyel előírjuk, h. egy alkalmazás milyen műveletet végezzen el a dok. adott részén.
3 A HTML nyelv változatai A HTML a W3C hivatalos ajánlása és a főbb böngészők (MS IE és NN) általában ragaszkodnak hozzá, de további nem- szabványos kódokat is biztosítanak és néhány sajátosságot másként valósítanak meg. Az aktuális változat a HTML 4.0. A leghaladottabb jellegzetességeire célszerű két változatot fejleszteni és a megfelelőt küldeni a böngészőnek. A HTML 4 változatot általában dinamikus HTML-nek nevezik. A HTML bővíthető formájára, az Extensible Hypertext Markup Language-re (XHTML) HTML 5-ként is szokás hivatkozni.
4 A HTML 4 főbb újdonságai Cascading Style Sheet (CSS): többszintű Weblap tartalom vezérlés, igényesebb űrlapok készítése, keretek támogatása (a főbb böngészők már támogatták), táblázatok továbbfejlesztése a feliratok (caption) használatára (Braille, felovasók részére), az oldalak többnyelvű kezelése és továbbítása.
5 A HTML elemei Leíró címkékkel (tag) azonosítja a dok. különböző részeit. A címkéknek kettős feladatuk van: 1.Meghatározzák a dok. szerkezetét és formázását (a böngésző tudja értelmezni és megjeleníteni a dok-ot) 2.Helymegjelölők (a kereső programok megtalálják a dok. főbb részeit)
6 Hypertext A HTML dokumentum egy meghatározott része. Olyan szöveg, ami egy másik, rendszerint Web dokumentumban lévő információra történő hivatkozást tartalmaz. A normál szövegtől megkülönböztetve jelenik meg. Kijelöli a Web dokumentum kapcsolódási pontjait.
7 HTML alapok Dokumentum specifikáció Fejléc Cím Törzs <BODY BACKGROUND="file.name" BGCOLOR="színkód" TEXT="színkód" LINK="színkód"...> ahol a színkód: rrggbb (r,g,b: 0-F) alakú
8 HTML alapok Félkövér Dõlt Aláhúzott Felsõindex Alsóindex sortörés egy bekezdésen belül. bekezdés Címsor rendezetlen lista keret rendezett lista keret listafejléc lista sor definíciós lista keret definíciós kifejezés definíciós leírás
9 HTML alapok Táblázat címe táblázati sor oszlop-/sorfejléc <TD COLSPAN="szám" ROWSPAN="szám" ALIGN="hely" VALIGN="hely" WIDTH="% vagy pixel" HEIGHT="% vagy pixel">
10 HTML űrlapok Felhasználói adatbevitelt tesz lehetővé Az elküldött információkat egy kiszolgálón futó program dolgozza fel (ált. CGI szkript)
11 HTML űrapok vezérlő elemek típus:TEXT, PASSWORD, RADIO, CHECKBOX, IMAGE, RANGE, HIDDEN, SUBMIT, RESET
12 HTML űrlapok forrás -->
13 HTML űrlapok Indulo lap DOLGOZO adatai TEXT: TEXTAREA: <TEXTAREA NAME=TEXTAREA1 ROWS=5 COLS=20> PASSWORD: <INPUT NAME=PASSWORD1 TYPE=PASSWORD> RADIO: <INPUT NAME=RADIO1 TYPE=RADIO VALUE=V1> CHECKBOX: <INPUT NAME=CHECKBOX1 TYPE=CHECKBOX> SELECT: O1 O2
14 CGI kapcsolat CGI = Common Gateway Interface egy általános, platform független interface a WEB server és az általa indított külső programok között böngésző WEB szerverCGI program k.változók Std. IO DB szerver A CGI programot rendszerint egy megadott könyvtárban kell elhelyezni Tetszőleges programozási nyelvet, script nyelvet lehet használni
15 CGI kapcsolat A CGI program elhelyezése, meghívása Védelmi okok miatt a CGI programok rendszerint csak a megadott könyvtárakban helyezhetők le Ezen könyvtárakat a WEB Server konfigurációjánál adjuk meg Az URL-ben a könyvtár alias nevére kell hivatkozni (szintén a a WEB Server konfigurációs állományban adott) default port: 80 protokoll domain cím könyvtár alias = c:\apache\cgi-bin program file
16 CGI kapcsolat Paraméter küldése a programhoz nem parancssori paraméterekkel, hanem környezeti változókkal vagy a szabvány IO csatornán keresztül lehetséges. Fontosabb környezeti változók: SERVER_NAME: a WEB szerver IP vagy domain neve SERVER_PORT: a WEB szerver port címe SERVER_SOFTWARE: a WEB szerver neve SERVER_PROTOCOL: a kapcsolati protokoll SCRIPT_NAME: a CGI program neve REQUEST_METHOD: az igénylő által megadott paraméter átadási mód (pl. POST, GET,..) REMOTE _USER: az igénylő felhasználó
17 CGI kapcsolat Fontosabb környezeti változók: REMOTE_HOST: az igénylő gép domain címe REMOTE_ADDRESS: az igénylő gép IP címe QUERY _ STRING: a CGI programnak küldött paraméterek PATH_TRANSLATED: az igényelt file OS azonsítása HTTP _*: http spe HTTP_USER _AGENT: az igénylő program típusa CONTENT_TYPE: csatolt adatsor típusa CONTENT _LENGTH: csatolt adatsor mérete AUTH _TYPE: igényelt azonosítási mód
18 CGI kapcsolat A GET vagy POST átadási metódus jelentése A CGI program a szerver és a kliens program említett paramétereit mindig a megadott környezeti változókon keresztül kapja meg A kliens űrlap (FORM) mezőinek paramétereit viszont megkaphatja - környezeti változókban (GET mód) - szabvány INPUT csatornán (POST mód) A GET módban a paraméterlista az URL része lesz FORM WEB szerverCGI program k.változók Std. IO POST GET
19 CGI kapcsolat A válaszlap generálása A CGI program által a szabvány OUTPUT csatornára kiküldött karaktersorozat lesz a kliensnek elküldött válaszlap tartalma. Pl. C-ben:... printf(“ Cimlap %s \n”, szoveg); … Ügyelni arra, hogy a válaszlap első sora adja meg a dokumentum típusát: printf ("Content-type: text/html\n\n");
20 CGI kapcsolat #include main() { char line[300]; printf ("Content-type: text/html\n\n"); printf (" \n"); printf ("SERVER_NAME : %s \n",getenv("SERVER_NAME")); printf ("SERVER_PORT : %s \n",getenv("SERVER_PORT")); printf ("SERVER_PROTOCOL : %s \n",getenv("SERVER_PROTOCOL")); printf ("SERVER_SOFTWARE : %s \n",getenv("SERVER_SOFTWARE")); printf ("SCRIPT_NAME : %s \n",getenv("SCRIPT_NAME")); printf ("REQUEST_METHOD : %s \n",getenv("REQUEST_METHOD")); printf ("REMOTE_USER : %s \n",getenv("REMOTE_USER")); printf ("REMOTE_IDENT : %s \n",getenv("REMOTE_IDENT")); printf ("REMOTE_HOST : %s \n",getenv("REMOTE_HOST")); printf ("REMOTE_ADDR : %s \n",getenv("REMOTE_ADDR"));
21 printf ("QUERY_STRING : %s \n",getenv("QUERY_STRING")); printf ("SERVER_NAME : %s \n",getenv("SERVER_NAME")); printf ("PATH_TANSLATED : %s \n",getenv("PATH_TRANSLATED")); printf ("PATH_INFO : %s \n",getenv("PATH_INFO")); printf ("GATWAY_INTERFACE : %s \n",getenv("GATWAY_INTERFACE")); printf ("CONTENT_TYPE : %s \n",getenv("CONTENT_TYPE")); printf ("CONTENT_LENGTH : %s \n",getenv("CONTENT_LENGTH")); printf ("AUTH_TYPE : %s \n",getenv("AUTH_TYPE")); printf ("HTTP_USER_AGENT : %s \n",getenv("HTTP_USER_AGENT")); if (!strcmp(getenv("REQUEST_METHOD"),"POST")) { gets(line); printf ("Input line: %s \n",line); } printf (" \n"); } CGI kapcsolat
22 Indulo lap CGI kapcsolat
23 CGI kapcsolat
24 CGI kapcsolat
25 CGI Adatbázis kapcsolat A CGI program kapcsolódása az adatbázishoz adatbázis és forrásnyelv függő. Pl. OCI interface kell az Oracle - C kapcsolatnál. olog(&lda, (ub1 *)hda, username, -1, password, -1,…) oopen(&cda1, &lda, …) oparse(&cda1, parancs,…) odefin(&cda1, 1, (ub1 *) &valtozo,…) odescr(&cda1, 1, &valtozo,…) obndrv(&cda1, (text *) ":NEV”,…) oexec(&cda2) ofetch(&cda2) oexfet(&cda1, (ub4) 1,...) oclose(&cda1) ologof(&lda)
26 CGI Adatbázis kapcsolat #include #include /* LDA es CDA strukturak */ #ifdef __STDC__ #include #else #include #endif #include #define DEFER_PARSE 1 /* oparse jelzok */ #define NATIVE 1 #define VERSION_7 2 Mintaprogram, amely a beolvasott érték alapján elvégez egy adatbázis lekérdezést, s az eredményt kiírja a válaszlapra
27 CGI Adatbázis kapcsolat text *username = (text *) "SCOTT"; text *password = (text *) "TIGER"; Lda_Def lda; /* LDA, HDA es cursor strukturak */ ub4 hda[HDA_SIZE/sizeof(ub4)]; Cda_Def cda1; Cda_Def cda2; void do_exit(); main() { char line[300]; char *c; char ert[100]; int i; char parancs[100]; sword kor; printf ("Content-type: text/html\n\n"); printf (" \n");
28 CGI Adatbázis kapcsolat if (olog(&lda, (ub1 *)hda, username, -1, password, -1, (text *) 0, -1, (ub4)OCI_LM_DEF)) { printf ("nyitasi hiba \n"); exit(EXIT_FAILURE); } printf("Kapcsolodas az ORACLE-hez (%s) sikeres \n", username); if (oopen(&cda1, &lda, (text *) 0, -1, -1, (text *) 0, -1)) { printf ("parancs nyitasi hiba \n"); do_exit(EXIT_FAILURE); } if (!strcmp(getenv("REQUEST_METHOD"),"POST")) { gets(line); c = strstr(line,"TEXT1"); c += 6; i = 0;
29 CGI Adatbázis kapcsolat if (!strcmp(getenv("REQUEST_METHOD"),"POST")) { gets(line); c = strstr(line,"TEXT1"); c += 6; i = 0; while (*c != '&' && *c) {ert[i++] = *c++;} ert[i] = '\0'; printf ("Nev = %s \n",ert); sprintf (parancs,"SELECT KOR FROM DOLGOZO WHERE KOD=%s ",ert); if (oparse(&cda1, parancs, (sb4) -1, DEFER_PARSE, (ub4) VERSION_7)) { do_exit(EXIT_FAILURE); } if (odefin(&cda1, 1, (ub1 *) &kor, (sword) sizeof(sword), (sword) INT_TYPE, (sword) -1, (sb2 *) 0, (text *) 0, -1, -1, (ub2 *) 0, (ub2 *) 0)) { do_exit(EXIT_FAILURE); }
30 CGI Adatbázis kapcsolat if (oexfet(&cda1, (ub4) 1, FALSE, FALSE)) { if (cda1.rc == NO_DATA_FOUND) kor = 10; else { do_exit(EXIT_FAILURE); } printf ("KOR = %d \n", kor); do_exit(EXIT_SUCCESS); } printf (" \n"); }
31 CGI Adatbázis kapcsolat void do_exit(exit_code) sword exit_code; { sword error = 0; if (oclose(&cda1)) { fprintf(stderr, "Error closing cursor 1.\n"); error++; } if (ologof(&lda)) { fprintf(stderr, "Error on disconnect.\n"); error++; } if (error == 0 && exit_code == EXIT_SUCCESS) printf ("\nG'day\n"); exit(exit_code); }
32 CGI Adatbázis kapcsolat