slo flag eng flag homepage dot software dot tips tricks dot links title picture interaktivno programiranje na internetu uvod vsi smo ze slisali za svetovni splet in pisanje dokumentov zanj toda kaj se zgodi ko zelimo da imajo nase stranke dostop do nasega prodajnega kataloga ko jim zelimo omogociti da po njem brskajo ter iscejo se bolj pogost problem ki ga srecajo pisci strani svetovnega spleta je vprasanje s katerim pregledovalnikom uporabniki nase strani pregledujejo sedaj ze sami pregledovalniki ponujajo razne nestandardizirane html razsiritve ki so sicer zelo mikavne toda nihce nam ne zagotavlja da bo to znal prebrati tudi kaksen drug pregledovalnik ce zelimo uporabljati razne razsiritve html ja je torej pametno vedeti ce bo uporabnikov pregledovalnik le te sploh razumel kaksa je tu resitev no tu se zadeve z samim html jem ne dajo resiti html specifikacija namrec predvideva staticne dokumente brez vsake interaktivnosti to se pravi da so vsi dokumenti ze vnaprej pripravljeni in da se na zahtevo uporabnika nalozijo nekje sem prebral da zna to biti tudi zanimivo saj lahko brskas in prebiras razne dokumente ki te zanimajo toda prav tako lahko to delas v knjiznici to je sicer receno cinicno in malo pretirano toda v principu drzi vsekakor so taksne staticne domace strani cisto dobre za posameznika ce pa zelimo narediti dobro predstavitev podjetja ali kaksno drugo aplikacijo ki zahteva interaktivno sodelovanje uporabnika smo opleli no s samim html jem ze toda pametni ljudje so ze nasli resitev glavna ideja je bila ta da se ne bi izgubljalo casa s pisanjem stvari ki so ze napisane vec casa bi tako lahko razvijalci posvetili samemu nacrtovanju ki je pri tem izredno pomembno saj se lahko zelo hitro zapletemo in uporabnik ne dobi podatkov ki jih je zelel odlocili so se da bodo izrabili delo programerjev ki so napisali spletne pregledovalnike ti pregledovalniki komunicirajo po http protokolu in to ze od daljnega leta to je v bistvu najmlajsi servis ki se je pojavil na internetu vendar je tudi krivec ki je povzrocil vse svetovno evforijo ter internet koncno priblizal tudi navadnim smrtnikom s svojim graficnim vmesnikom in ravno ta graficni vmesnik bi bilo dobro izkoristiti kratka zgodovina in princip delovanja ze prva specifikacija html ja je ponujala moznost razsiritve ter interakcijo in sicer z ukazom isindex v glavi oz t i headerju ta ukaz nam je izpisal na vrhu dokumenta da imamo moznost iskanja ter izrisal polje za vnos iskanih parametrov prva pomanjkljivost je bila ta da se je to moralo izpisati v prvi vrstici tako so lahko navodila sledila sele za tem no temu se je dalo enostavno izogniti s tem da se nisi drzal specifikacije ter to ukazno vrstico napisal drugje v dokumentu tudi tako je vse lepo delovalo prvi tak svetovno poznan primer je bil iskalec lycos v specifikaciji html pa se je to ze dalo izvesti dosti bolj elegantno saj je ze predvidevala obrazce forms obrazci so tako postali nekaksen graficni vmesnik nasih programov saj za iskanje in podobne aktivnosti ki terjajo da se dokumenti oblikujejo dinamicno potrebujemo zunanje programe ker pa je osnovna lastnost interneta da je sistemsko neodvisen so tudi to zastavili zelo splosno tako smo dobili nov programski jezik ki so ga poimenovali cgi ali common gateway interface kot ze samo ime pove je to nekaksen povezovalnik oz vmesnik med lokalnim programjem in html jem ki ga uporabljamo kot graficni vmesnik to se pravi da lahko napisemo poljuben program in celo v poljubnem programskem jeziku oz skripti ki zna brati in pisati na standardni vhod in izhod predpogoj pa je seveda da se ta program da prevesti in poganjati na racunalniku na katerem tece spletni streznik tu se seveda pojavi vprasanje varnosti saj mora biti ta program dostopen vsem za branje in poganjanje o tem so seveda tudi dosti razmisljali ter postavili dolocena pravila ki nam zagotavljajo zadostno varnost toda to pustimo za drugic kaksno vlogo igra tu streznik streznik sprejme od odjemalca zahtevo po informaciji sama oblika zahteve je tocno definirana tako da nam vedno pove kateri dokument zelimo kje se ta dokument nahaja kdo ga zeli ime racunalnika ki ga uporabljamo ponekod pa celo e mail naslov s katerim protokolom zelimo dostopati do tega dokumenta s katerim uporabniskim programom dostopamo itd to so spremenljivke okolja in se nahajajo v glavi dokumenta vseh skupaj pa jih je devetnajst poleg teh pa definiramo tudi svoje spremenljivke in sicer preko obrazcev vsak podatek oz vnosno polje ima svoje ime vnesene podatke tako lahko preko imen vnosnih polj spremenljivk prenesemo do nasega programa tu igra glavno vlogo streznik saj preusmeri tok podatkov za cgi programe tako da lahko v programih beremo in pisemo kar na standardni vhod in izhod izpisujemo lahko tako kar na standardni izhod server pa to preusmeri do uporabnikovega spletnega pregledovalnika kako posredujemo podatke programu kot ze vemo cgi deluje samo z html obrazci forms programom torej posredujemo informacije s pomocjo skrbno pripravljenih obrazcev ki morajo biti pregledni in poskrbeti da bo vecina uporabnikov vnesla vse potrebne parametre tu se v predvidena polja vnasajo parametri oz se s klikom miske izberejo vsakemu polju dodelimo svoje ime to ime postane spremenljivka ki se ji priredi vrednost vnesenega polja le ta pa se nato prenese nasemu programu vsak tak obrazec je nato potrebno poslati strezniku in sicer z gumbom submit to se da resiti tudi bolj elegantno in sicer s sliko obcutljivo na klik ce pa se se malo posluzimo skritih obrazcev lahko naredimo zelo lepe dokumente ki sploh ne delujejo kot obrazci vedno moramo poskrbeti da so vneseni vsi potrebni parametri programa ni nujno da so to vsi parametri toda takoj ko manjka kaksen potreben parameter nam bo nas program javil napako in se ne bo izvrsil to se da resiti tako da znotraj nasega programa preverimo ce so prisotni vsi potrebni parametri seveda moramo pomisliti tudi na napacne vnose in poskrbeti da uporabnika obvestimo o napaki ter mu omogocimo vrnitev na mesto kjer je napaka nastala za to moramo poskrbeti mi saj so sele zadnje implementacije netscape a zadosti pametne beri sledijo zadostim parametrom da se vrnejo na prejsnje mesto cgi programa vsekakor pa je potrebno uporabnika obvestiti kaj je bilo narobe in kako naj to popravi to so seveda tudi dinamicni dokumenti ki se tvorijo glede na vrsto napake http pozna dva nacina prenosa podatkov post in get pri get se vsi podatki shranijo v spremenljivko okolja query string to pa je omejena vrednost bajtov tako je bolje da takoj ko obdelujemo vecje kolicine podatkov uporabimo metodo post pri tej metodi pa moramo podatke prebrati sami tu je potrebno vedeti kako pregledovalnik poslje zahtevo do streznika to se poslje v glavi dokumenta poglejmo kako izgleda glava dokumenta ko posljemo izpolnjen obrazec ki vsebuje samo eno spremenljivko spremennljivka bobo pri postopku get request metod get query string spremenljivka bobo content type prazno content lenght prazno pri enakem obrazcu in s postopkom post pa dobimo naslednjo glavo dokumenta request metod post query string prazno content type application x www form urlencoded content lenght s spremenljivko content type smo povedali strezniku da so spremenljivke in njihove vrednosti zapisane kot url to pomeni da so presledki spremenjeni v znake nealfanumericni znaki pa so kodirani v obliki xx kjer je xx sestnajstiska koda ascii ustreznega znaka med spremenljivkami in njihovimi vrednostnmi je enacaj med seboj pa so locene z znakom spremenljivka vrednost spremenljivka vrednost content lenght pa nam pove da moramo v nasem primeru iz standardnega vhoda prebrati devetnajst znakov ime spremenljivke enacaj in vrednost spremenljivke sedaj ko poznamo obliko v kateri nam streznik posreduje podatke ne bi vec smeli imeti probleme pri zajemanju le teh zadeva seveda ni cisto trivialna saj se pogosto zgodi da so nekateri podatki zgolj opcije in jih ne vnesemo takih spremenljivk streznik sploh ne prenasa to je potrebno upostevati pri pisanju programov ali pa uporabiti knjiznice kot je cgic ki ze poskrbe za te 'malenkosti' kako posredujemo rezultate nazaj pregledovalniku kot sem ze omenil se rezultati posredujejo kot cista html koda to se pravi da izoblikujemo dinamicni html dokument s pomocjo ukazov za izpis na standardni izhod stdout edina zadeva ki jo je potrebno navesti in je pri standardnem html dokumentu ni ker jo posreduje sam streznik pa je glava dokumenta glava dokumenta pove odjemalcu kaksen dokument sprejema pri tem ni potrebno izpisati celotne glave dokumenta temvec samo tip dokumenta content type text html za tem mora slediti se obvezna prazna vrstica to je bil obvezen del sedaj pa lahko izpisemo dobljene rezultate v poljubni html kodi ce bi recimo zeleli izpisati starost osebe z imenom bobo ki smo jo posredovali strezniku v prejsnjem primeru bi napisali naslednjo c kodo main char podatki predvidevam da ime ni daljse od crk znakov pa je dolgo ime spremenljivke znak enako sti char ime starost int i double dolzina preberemo dejansko dolzino prenesenih znakov const char dolzina stringa getenv content length dolzina strtod dolzina stringa null for i i dolzina i fscanf stdin c podatki ime izlusci ime starost starost osebe printf content type text html\n\n tu je obvezno da vnesemo eno prazno v rstico printf html \n head \n title ime iskane osebe \title \n head \n body printf s je star s\n ime starost printf body \n html kako naj napisem cgi program mislim da je to najlazje pojasniti kar na primeru vse kar bom povedal bo na zelo abstraktni ravni to se pravi da se ne bom spuscal v podrobnosti same kode in bom zadeve zapisal na visjem bolj razumljivem nivoju pogledali si bomo tudi primere programske kode vendar samo toliko kot je potrebno za razumevanje drzal se bom sintakse programskega jezika ansi c in uporabljal knjiznico cgic ki je napisana za lazje pisanje cgi programov poudarjam pa da se sam program lahko napise s poljubnim orodjem vse dokler se da program prevesti in izvajati na strezniku svetovnega spleta tako je program ki ga napisemo v kaksnem standardnem jeziku kot je to ansi c prenosljiv na vse racunalniske sisteme pisanje cgi programov v osnovi je programiranje z cgi razdeljeno v tri osnove korake oblikovanje obrazca ki ga bo videl uporabnik s pomocjo html jezika pisanje programa ki bo prebral in obdelal podatke napisemo dokument ki bo uporabniku prikazal rezultate nasega programa v nadaljevanju si bomo vsakega od korakov pogledali na nasem primeru recimo da zelimo napisati program ki nam bo izracunal kompleksnost programa pisanega v ansi c jeziku kaj vse ta program pocne nas tu ne zanima zanima nas samo katere parametre in kako jih bomo programu posredovali ter kako bomo dobljene rezultate zapisali nazaj v lepo html obliko oblikovanje obrazca najprej je potrebno sestaviti obrazce preko katerih bomo vnasali podatke nas program bo potreboval naslednje podatke ime programa izvorna koda programa osnovna oblika html dokumenta ki bi nam omogocila vnos vseh zeljenih dokumentov bi izgledala takole html head title program softek vnos podatkov title head body to je program ki oceni kompleksnost programa napisanega v ansi c jeziku prosim ce vnesete ime programa in izvorno kodo p form method post action http imola uni mb si ~bobo cgi bin softek izracun bobo ime programa input name ime programa type text size br izvorna koda br center textarea name izvorna koda rows cols textarea p input type submit value potrdi vnos name potrdi vnos center form body header tu si lahko pogledas tudi kako bi ta obrazec izgledal v pregledovalniku s tem smo zakljucili prvi del izdelave programa napisali smo namrec nekaksen graficni vmesnik s katerim bo uporabnik komuniciral tu nisem kompliciral in sem zadevo napisal kar se da preprosto tako da ne sprejemam kritik glede na slabo oblikovanje pisanje programa no to pa je jedro nasega dela to je najpomembnejsi del saj ce nam ne deluje program nam tudi lepsi vnosni obrazec kot je moj ne pomaga program bomo napisali kot je ze razvidno iz zgornjega obrazca in ste to tudi sami ze opazili v post metodi zakaj zato ker so programi predolgi da bi jih lahko stlacili v bajtov kot nam to omogoca spremenljivka okolja query string ko delamo z metodo post moramo sami poskrbeti za branje podatkov tu velja opozoriti da nam pregledovalnik pri posredovanju zahteve ne vnese vedno znaka za novo vrsto cr lf na konec prenasanega stringa dolzino zahteve dobimo iz spremenljivke okolja content length kot je ze bilo opisano zgoraj tu sem se odlocil da se ne bom obremenjeval s problemi ki so jih resili ze drugi in pustil tezasko delo knjiznici cgic ta cudovita knjiznica poskrbi da so vse spremenljivke okolja ze vnesene v lokalne spremenljivke tipa char razen content length ki je int in jih lahko lepo uporabljamo ker ze sama knjiznica vsebuje stavek main se bo nas program zacel z cgimain za natancnejsa navodila si poglejte zgornji link lotimo se dela najprej napisimo podprograme za zajemanje spremenljivk ime programa in izvorna koda ki smo ju definirali pri vnosnem obrazcu void ime char ime predvidevam da ime ne bo daljse od znakov cgiformstringnonewlines ime programa ime vidimo da je to prava malenkost ce uporabljamo taksno knjiznico v primeru da knjiznice ne bi zeleli uporabiti pa bi koda izgledala takole include stdlib h include stdio h include string h void ime int i char data predvidevam da obrazec ne bo vseboval vec kot znako v double dolzina char ime predvidevam da ime ne bo daljse od znakov const char str len getenv content length preverimo dejansko dolzino o brazca dolzina strtod str len null pretvorimo string v double for i i dolzina i fscanf stdin c data preberemo obrazec in ga shranimo v lokalno spremenljivko data data ' ' dodamo znak za konec podatkov tu bom sedaj klical ze napisano funkcijo ki izlusci zeljeno spremenljivko i z data spremenljivke to je kar zahtevna funkcija ki so jo lahko tudi ogledat e get var data ime ime programa zelo lepo se vidi da zadeva nikakor ni enostavna se posebaj ce upostevamo vse mozne nestandarnde znake in njihove pretvorbe prav tako je potrebno paziti se na nekaj drugih stvari ki se lahko pojavijo v nekaterih pregledovalnikih zato vam tudi svetujem da uporabljate kaksno ze napisano knjiznico kot ste videli sem z uporabo ene od njih celotno zgornjo zmesnjavo napisal v dveh vrsticah podobno napisemo tudi za spremenljivko izvorna koda sedaj smo prenesli spremenljivke iz obrazca v nas program preostane pa nam se da napisemo program ki bo te podatke obdelal in vrnil zeljeni rezultat ta program je nastal v sklopu predmeta praktikum iz informatike ki se poucuje v sestem semestru na elektrotehniski fakulteti univerze v mariboru program se imenuje softek funkcija ki vrsi izracun pa izracun cpp pogledate si lahko tudi pripadajoco izvorno kodo ki se ni prirejena za cgi dobite lahko tudi ze preveden program za dos okolje izpis rezultatov v html obliki preden nas program zakljuci z delom mora pregledovalniku poslati dokument v html kodi ki vsebuje rezultate njegove analize drugace bi seveda nase delo ostalo neopazeno napisimo torej program ki nam bo izpisal porocilo void izpis rezultatov tu veljajo osnovna pravila c programiranja zaradi e nostavnosti in vecje preglednosti sem se odlocil da bom uporablja l globalne spremenljivke ce vam ni vsec lahko s premenite cgiheadercontenttype text html fprintf cgiout html head title softek results of analysis title \n bod y \n fprintf cgiout center font size b your program was successfully analyz ed b font center fprintf cgiout p b results of analysis b fprintf cgiout p pre softek v copyright c bostjan vlaovic maj \n\n fprintf cgiout program name s\n ime fprintf cgiout \n\n absolute value relative value\n fprintf cgiout number of lines d\n st vrstic fprintf cgiout number of lines with comment d f \n st komentarjev procent st komentarjev st vrstic fprintf cgiout number of blank lines d f \n pre st praznih vrstic procent st praznih vrstic st vrstic fprintf cgiout return to the a href \ http imola uni mb si ~bobo slo sola pi obrazec html\ input form a fprintf cgiout hr pre \n\n pre author a href \ mailto bostjan vlaovic u ni mb si\ bostjan vlaovic a fprintf cgiout body html s tem smo nas primer zakljucili kako deluje v praksi lahko preizkusite z naslednjim klicem http imola uni mb si cgi bin softek bobo program je v angleskem jeziku zato ker nameravam napisati tudi anglesko verzijo se opravicujem za vse neprijetnosti ki sem vam jih s tem povzrocil v samem programu sem se dodatno preverjal ce je prislo do napacnega vnosa ter napako javil nazaj uporabniku to je zelo pomemben del saj uporabnik drugace ne ve kaj je narobe in kako naj to popravi ker je ta program kratek in ne tvori vecje stevilo strani nisem uporabljal skritih spremenljivk s skritimi spremenljivkami lahko sledimo poteku dogajanj belezimo lahko npr kje smo bili tako da se lahko v vsakem trenutku vrnemo na prejsnjo stran ce vam je bil ta kratek uvod v cgi v pomoc sem zadovoljen edino kar vas prosim pa je to da mi poveste vase mnenje to je prva verzija tega dokumenta ki je bila pripravljena v okviru seminarske naloge za praktikum iz informatike zato verjetno se vsebuje kaksne napake lepo prosim da mi jih sporocite avtor bostjan vlaovic stevilo obiskov