T Hypermediadokumentin laatiminen. Sisältö. Tavoitteet. Mitä on www-ohjelmointi? Arkkitehtuuri (yleisesti) Interaktiivisuuden keinot

Transkriptio

1 T Hypermediadokumentin laatiminen -Ohjelmointi Peruskäsitys www-ohjelmoinnin kentästä Tekniikat interaktiivisuuden toteuttamiseen tekniikat tekniikat Tietokannat Juha Laitinen TKK/TML Mitä on www-ohjelmointi? Tavoitteet Dynaamista sisältöä Internetiin Laitteistoriippumattomuus Interaktiivinen sovellus Palvelut helposti ja tutussa muodossa Yleisö! Interaktiivisuuden keinot Arkkitehtuuri (yleisesti) Tarvitaan palaute Client - Server HTML Lomakkeet Linkit Kuvat Upotetut tai integroidut tekniikat: Java-appletit, JavaScript, Flash 1

2 Arkkitehtuuri (lisää kerroksia) Arkkitehtuuri (.. ja tekniikat) Java, CGI, PHP,.. Ulkoiset apuohjelma t -ohjelma Tietokanta Interaktiivisuus Ulkoiset apuohjelma t Interaktiivisuus -ohjelma SQL Tietokanta Interaktiivisuus Muotoilu HTTP HTML CSS JavaScript CSS, Templatet Ulkoasu Staattiset HTML:t Haasteet Muutama sääntö.. Monta protokollaa Monta tekniikkaa Monta kieltä Epäyhtenäinen asiakasohjelmisto Yksinkertaista? Huomioi yleisö Tee mahdollisimman vähän oletuksia asiakkaan kokoonpanosta Käytä standardeja / suosituksia KISS? Miten asiakas ja palvelinohjelma keskustelevat? Esimerkki: Tyypillinen keskustelu.. Pyyntö Vastaus Keskusteluprotokolla: HTTP (HyperText Transfer Protocol) RFC 2616 (Hypertext Transfer Protocol HTTP/1.1) 2

3 Interaktiivisuuden toteutus 1: Lomakkeet Kenttiä HTML-sivulle Tekstiä, valintoja, rasteja, listoja ja nappeja Selain siirtää kenttiin täytetyt tiedot palvelimelle Piilokentät Lomakkeiden toiminta yleisesti käsittelee tiedot Selain Käyttäjä lomake-html-sivu Selain lähettää lomakkeen tiedot submit GET/POST-pyynnössä Palaute (HTML-sivu) Selain näyttää elementit käyttäjälle Selain näyttää palautesivun käyttäjälle Käyttäjä täyttää lomakkeen GET vs. POST Tiedonvälitystapoja GET Kirjanmerkit URL:in kokorajoitus POST Turvallisempi Suurempi siirrettävän tiedon määrä Ei toistettavissa Interaktiivisuuden toteutus 2: Linkit & Kuvat URL:ien uudelleenkirjoitus palvelimella Linkit & kuvat luodaan palvelimella tilanteen mukaan Toimii kaikkialla Raskas (tiedonsiirto, käsittely palvelimella) Hankala toteuttaa Interaktiivisuuden toteutus 3 & 4 : skriptit & -ohjelmat MIME-tyypit Tuetut ohjelmat vaihtelevat Toiminta ei taattua Esim. JavaScript päällä 92% selaimista (lähde: Esim. Macromedia Flash (SWF) 97.4% (Kesäkuu 2003, lähde: NPD Research) 3

4 tekniikat (vs. asiakastekniikat) tekniikoita tekniikoita CGI HTML-lomakkeet Integroidut Integroidut Apache moduulit DHTML, Appletit Java Servlet Upotetut Upotetut (selainten skriptikielet) SSI, PHP, mod_perl, ASP, JSP, SSJS ECMAScript/JavaSc ript/jscript Sovelluspalvelimet VBScript ActiveX Plug-in ohjelmat Esimerkki: CGI Common Gateway Interface Sallii palvelimella sijaitsevien ohjelmien käytön www-palvelimen läpi Ongelmia & Ratkaisuja 1: / Ulkoasu / Ohjelma Minne sisältö? Minne ulkoasu? Minne ohjelma? Kaikki samaan paikkaan? CGI-keskusteluesimerkki Ongelmia & Ratkaisuja 2: Sessionhallinta HTTP State Management Mechanism - Proposed Standard RFC Mitä ovat keksit? (Cookies) URL:n uudelleenkirjoittaminen Ongelmia & Ratkaisuja 3: Käyttäjän tunnistus RFC 2617: HTTP Authentication: Basic and Digest Access Authentication Basic: salasana välittyy suojaamattomana Esimerkki HTTPS (HTTP over SSL) 4

5 Ongelmia & Ratkaisuja 4: Erikoismerkit, sallitut ja virheelliset merkit Erikoismerkkien ongelma Merkistökysymykset Mitä täytyy ottaa huomioon? HTML-ohjausmerkit (character entity references) URL-enkoodaus (%20 =, RFC 2396) JavaScript-erikoismerkit SQL-erikoismerkit... 5