Applikasjonsutvikling mot web

Transkript

1 Applikasjonsutvikling mot web Databaseapplikasjoner Informasjonssystemer Arkitektur PHP = PHP Hypertext Processor PHP og HTML Grunnleggende konstruksjoner (variabler, løkker, valg, ) Tabeller og assosiative tabeller Behandle skjemadata (HTML Forms) Representere databasetabeller som assosiative matriser PHP og MySQL Etablere og lukke databaseforbindelser Utføre SQL-spørringer Behandle spørreresultater Pensum: Kapittel 12 og 13

2 Informasjonssystemer En database er en logisk samling av data. Et databasesystem er en database administrert av et databasehåndteringssystem (DBHS). En applikasjon er et program utviklet for en bestemt anvendelse. En databaseapplikasjon er en applikasjon som bruker et databasesystem for lagring av data. Et informasjonssystem består av komponenter for å samle inn, lagre, behandle, overføre, søke etter og presentere informasjon som blir brukt i en virksomhet. Mer konkret: Informasjonssystem = Databasesystem + Applikasjoner

3 Databaseklienter i et nettverk Brukere jobber med databasen fra klientmaskiner. Databaseapplikasjonen er kanskje installert på hver enkelt maskin. 3

4 Web-applikasjoner Web-applikasjoner «kjører i nettleseren». Brukergrensesnittet er typisk kodet i HTML Ikke behov for installasjon av klientapplikasjoner (typisk kun HTML på klientsiden tynne klienter). Brukergrensesnitter utviklet med et generelt programmeringsspråk som Java gir tykke klienter. 4

5 Arkitektur for web-løsninger Eksempelvis laget med: Brukergrensesnitt Forretningslogikk Dataaksess HTML, JavaScript PHP Lagrede rutiner Fysisk er en web-applikasjon fordelt på flere maskiner (database server, web server, klient) Logisk sett er den ofte bygd opp fra tre «lag» som vist over. De ulike lagene kan være programmert med forskjellige språk.

6 Plattform og utviklingsstakker PHP Apache MySQL Linux C#/ASP.NET IIS SQL Server Windows Java/JSF Apache Oracle Unix Plattform er en kombinasjon av maskinvare og basis programvare - ofte brukt synonymt med operativsystem (Windows- og Linux-plattform) Utviklingsstakk er en konkret kombinasjon av slike grunnleggende teknologier (operativsystem, DBHS, web-tjener, programmeringsspråk/skriptspråk) Apache mest brukte web-tjenere IIS Internet Information Server JSF Java Server Faces

7 Internett og web Lokalnett Lokalnett Lokalnett Internett Ruter Lokalnett Internett = et globalt nett av nettverk som fungerer i henhold til åpne standarder for kommunikasjon. Bygger på TCP/IP (Transmission Control Protocol / Internet Protocol). Web er en anvendelse av internett som e-post, filoverføring, fjerninnlogging, Kan i sin enkleste og opprinnelige form betraktes som en global samling av dokumenter knyttet sammen av hyperlenker.

8 Statiske web-sider GET fil.html HTML Internett HTTP fil.html Web server Nettleser (web-klient) HTML (HyperText Markup Language) dokumentformat som brukes for å lagre nettsider HTTP (HyperText Transfer Protocol) protokoll som styrer kommunikasjon mellem web-klient og web-server

9 Dynamiske web-sider fil.php HTML HTTP Internett Web server + PHP-tolker Nettleser (web-klient) POST fil.php PHP (Hypertext Preprocessor) er et skriptspråk for å utvikle web-applikasjoner.

10 Databasedrevne nettsteder Web server + PHP-tolker fil.php HTML POST fil.php HTTP SQL Spørre-re sultat Internett Nettleser (web-klient) Database-ser ver

11 Program på databasetjeneren Web server + PHP-tolker fil.php HTML POST fil.php HTTP Kall Respons Internett prog.sql Nettleser (web-klient) Database-serv er Utførelse av lagrede rutiner

12 Prosessering på klientsiden fil.php HTML HTTP Internett Web server + PHP-tolker Nettleser (web-klient) POST fil.php + JavaScript

13 Web-services Web server Web server fil2.java fil3.php XML SOAP Internett HTTP SQL fil1.php Spørre-re sultat Nettleser (web-klient) Database-ser ver

14 HTML og HTTP html head body title h1 p a a HTML (HyperText Markup Language) Elementer, attributter, startmerke, stoppmerke HTML-dokumenter er hierarkisk bygd opp HTTP (HyperText Transfer Protocol) Protokoll = en samling regler HTTP-forespørsel (GET, POST) og HTTP-respons (HTML-dok)

15 Web-tjenere, nettlesere og URLer Opprinnelig var web en samling av kryssrefererende HTML-dokumenter. Web-tjenere og nettlesere kommuniserer i henhold til en (tilstandsløs) klient/tjener-arkitektur. Nettleser Web-tjener fil1.htm En URL (Uniform Resource Locator) er en måte å referere web-ressurser (f.eks. HTML-dokumenter) på. protokoll domenenavn katalogsti filnavn

16 HTML-dokumenter og PHP-skript Nettleser Web-tjener side1.htm PHP-tolker side2.php HTML-dokumenter blir sendt direkte til nettleseren. PHP-skript blir sendt til en PHP-tolker for utførelse. Utdata som PHP-skriptet produserer blir sendt til nettleseren. Det betyr at klient-maskinen ikke ser PHP-koden. Web-løsninger programmert med PHP krever ikke installasjon av programvare på klienten; en standard nettleser er nok.

17 Nedlasting, installasjon og konfigurering Åpen kildekode Ferdigkompilert løsning for Windows AMP 1. Apache ( Sjekk localhost 2. MySQL 5.0 ( Windows installer 3. PHP 5 ( Last ned kompilert Windows-versjon Konfigurering Apache styrefil: httpd.conf PHP styrefil: php.ini Pakkeløsning WAMP (AMP on Windows) Enkel installasjon Meny: Starte/stoppe tjenester, MySQL-konsoll, tillegg, styrefiler

18 Dynamiske web-sider med PHP Nettleser HTML-skjema Skjemadata PHP utdata (HTML) Web-tjener PHP-tolker skript.php SQL DBHS Database Typisk oppsett Apache + PHP + MySQL + JavaScript 18

19 Den grunnleggende idéen Et typisk PHP-skript: 1. Motta og behandle skjemadata fra bruker. 2. Bruk skjemadata for å lage en SQL-spørring mot databasen. 4. Bruk spørreresultat (3) for å generere en ny HTML-side. Nettleser 1 4 skript.php 2 3 Database PHP web-applikasjoner: Tenk at hver nettside blir generert av ett PHP-skript (forenkling). Nettsidene er dynamiske fordi de er basert på skjemadata fra bruker og innholdet i databasen (som jo endrer seg ). Hver brukerinteraksjon i nettleseren går «innom» web-tjeneren (og et PHP-skript): forespørsel respons forespørsel respons

20 Hei web! PHP-koden plasseres mellom <?php og?> <html> <body> <?php print '<h1>hei web!</h1>';?> </body> </html> Denne blandingen av HTML og kode er karakteristisk for PHP (og flere andre skriptspråk). For eksempel Java Server Faces prøver å skille presentasjon og logikk klarere fra hverandre! Lagrer koden i hei.php og kopier ut på web-tjeneren med WinSCP. Åpner nettleseren på side WAMP på hjemme-pc: Lagrer PHP-filen på C:\<wamp-rot>\www\hei.php Åpner nettleseren på Slipper kopiering (kun lagre+ «refresh» i nettleseren) localhost: Bruker egen maskin som web-tjener (og web-klient)

21 Alternativ løsning Her blir det enda mer tydelig at nettsiden som blir levert er utdata fra et program (PHP-skriptet): <?php print '<html>'; print '<body>'; print '<h1>hei web!</h1>'; print '</body>'; print '</html>';?> Hva skjer på forrige lysark? PHP-motoren utfører PHP-skriptet, og «fletter» HTML-koden (utenfor PHP-taggene) med utdata fra skriptet. Mulig å ha flere «HTML-bolker» og «PHP-bolker» i samme skript (man går da ut og inn av «PHP-modus»).

22 Alle variabelnavn starter med $ Variabler <html> <body> <?php $navn = 'Ola'; print '<h1>hei '. $navn. '</h1>';?> </body> </html> Punktum slår sammen tekstverdier

23 Simulere input fra bruker Lagre denne filen som areal.php <html> <body> <?php $side = $_GET['txt_side']; $areal = $side * $side; print '<h1>areal: '. $areal. '</h1>';?> </body> </html> Kopier filen ut på ditt område på web-tjeneren home.hit.no Test i nettleseren Hva vises på nettsiden?

24 Enkle og doble apostrofer En tekst omsluttet av doble apostrofer kan inneholde variabler PHP-motoren erstatter slike variabler med sin verdi. Det er altså Ola og ikke $navn som blir vist på nettsiden (under). Doble apostrofer er «behagelige», enkle er litt mer effektive. <html> <body> <?php $navn = 'Ola'; print '<h1>hei '. $navn. '</h1>'; print "<h1>hei $navn </h1>";?> </body> </html>

25 En vanlig feil Man glemmer at variabelnavn starter med $ <html> <body> <?php $navn = 'Ola'; print '<h1>hei '. navn. '</h1>';?> </body> </html> Det blir skrevet ut en feilmelding på nettsiden Les feilmeldingen og legg merke til linjenummeret. Årsaken til Feil på linje 57 kan skyldes feil på linje 12!

26 Linjeskift i kildekoden Den synlige nettsiden er det viktigste, men I forbindelse med feilretting er det imidlertid behagelig om også kildekoden ser bra ut. \n produserer linjeskift (\t for tabulator ) <?php $navn = 'Ola'; print '<html>\n'; print '<body>\n'; print '<h1>hei '. $navn. '</h1>\n'; print '</body>\n'; print '</html>\n';?>

27 Datatyper Det er ikke nødvendig å deklarere variabler i PHP Datatyper boolean, integer, float, string array, object (og et par til) PHP-tolkeren utleder datatypen fra sammenhengen $et_heltall = 3; $et_kommatall = 3.14; $en_tekst = 'Ola'; $x = $et_heltall + 4;

28 Operatorer Aritmetiske operatorer + - * / % 10%3 er lik 1 Sammenligningsoperatorer > >= ==!= < <= == betyr likhet === lik og samme type!== ulik og forskjellig type Inkrement og dekrement og -1 Logiske operatorer &&! og eller ikke Noen spesielle operatorer..= slå sammen tekst legg til tekst += *= $x+=2; det samme som $x=$x+2;

29 Innebygde funksjoner Tekststrenger str_pad, strlen, substr, substr_replace, trim, ucfirst, Dato og tid date, getdate, gettimeofday, strtotime, Matematikk abs, ceil, cos, exp, floor, log, pi, rand, round, sin, sqrt, tan, Eksempler $s = substr('abcdef', 1, 3); // bcd $today = getdate(); $avst = sqrt(exp($x2-$x1,2) + exp($y2-$y1,2));

30 Konvertering Skjemadata er i utgangspunktet tekst $side = $_GET['txt_side']; // fra skjema $areal = $side * $side; Implisitt konvertering $tall = '2' + '2'; // $tall blir lik 4 Eksplisitt konvertering (typetvang, type casting) $tall = (int) '85'; Funksjoner for å avlese datatype is_int($tall), is_numeric($side),

31 Presentasjon av tall Parametre til funksjonen number_format: Antall desimaler Tegn for desimalpunktum Tusenskilletegn $pris = ; print( number_format($pris, 2, ',', ' ') ); Resultat: ,79

32 Valgsetninger Bruker skriver inn alder - programmet skriver ut pris $alder = $_GET['alder']; // Fra skjema $pris = 80; // Full pris if ($alder < 7) { $pris = 0; // [0..7> går gratis } else { if ($alder <= 12 $alder > 67) $pris = $pris * 0.5; // Halv pris } print ('Pris: '. $pris);

33 While-løkker Bruker skriver inn øvre grense (positivt heltall!) programmet skriver ut summen av tallene fra 1..max $max = $_GET['max']; // Fra skjema $tall = 1; $sum = 0; while ($tall <= $max) { $sum = $sum + $tall; $tall = $tall + 1; // Alternativt $tall++; } print('sum 1..'. $max. '='. $sum);

34 Tabeller i PHP Tabeller egner seg for gjennomløp med for-løkker // Nedbør (mm) pr. dag i en gitt uke $nedboer = array(3,0,0,23,0,17,4); $antall = sizeof($nedboer); // 7 elementer for (int $i=0; $i<$antall; $i++) { $sum += $nedboer[$i]; // Merk += } $snitt = $sum / $antall; print('totalt: '. $sum. ' snitt: '. $snitt);

35 Gjennomløp med foreach Hvis vi skal skrive ut alle verdiene i en tabell Trenger ikke å vite posisjonene foreach-løkker er da ofte en enklere løsning enn for-løkker For å produsere en punktliste må vi Skrive ut <ul> helt først og </ul> helt til slutt Så må vi omslutte hver verdi med <li> og </li> $tabell = array(3,0,0,23,0,17,4); print '<ul>'; foreach ($tabell as $enverdi) { print '<li>'. $enverdi. '</li>'; } print '</ul>';

36 Produsere en HTML-tabell For å skrive ut en HTML-tabell må vi nøste to løkker $tab1 = array(1,2,3,4,5); $tab2 = array(1,2,3,4,5,6,7); print '<table>'; foreach ($tab1 as $v1) { print '<tr>'; foreach ($tab2 as $v2) { print '<td>'. $v1*$v2. '<td>'; } print '</tr>'; } print '</table>'; Hvordan ser resultatet ut?

37 Assosiative tabeller Vanlige tabeller blir indeksert med heltall $tab[0], $tab[1], $tab[2], I assosiative tabeller kan vi velge indeksering $nedboer = array ( "mandag" => 3, "tirsdag" => 0, "onsdag" => 0, "torsdag" => 23, "fredag" => 0, "lørdag" => 17, "søndag" => 4 ); $man = $nedboer["mandag"]; // slår opp $nedboer["mandag"] += 2; // oppdaterer Tenk på assosiative tabeller som «funksjoner» (her fra dag til mm)

38 foreach-løkke Kan gjennomløpe alle elementene i en assosiativ tabell med en slags «mønstergjenkjenningsteknikk» $sum = 0; $nedboer = array( ); // Se forrige lysark foreach ($nedboer as $ukedag => $mm) { print($ukedag. " ". $mm. " mm"); $sum += $mm; } print("totalt ". $sum. " mm nedbør"); Tenk slik: En assosiativ tabell er en «mapping» fra nøkkel til verdi I vårt eksempel fra ukedager til nedbørsmengde Utfører løkkekroppen for hvert par nøkkel => verdi

39 isset og array_key_exists Finnes en bestemt nøkkel i en assosiativ matrise? $d = "juledag"; if (!array_key_exists($d, $nedboer)) print("ukjent ukedag"); Har vi fått inndata fra bruker? if (! isset($_get["txtantall"]) ) print("du må skrive et tall!");

40 HTML-skjemaer I Brukes for å hente inndata fra brukere Blir definert med elementet form Et form-element kan inneholde GUI-komponenter (tekstbokser, nedtrekkslister, kommandoknapper) <html><body> <form method="get" action="skjemabehandler.php"> <p> Navn: <input type="text" name="navn" size="20"> </p> <p> <input type="submit" value="søk" name="sok"> <input type="reset" value="rensk" name="rensk"> </p> </form> </body></html>

41 HTML-skjema II <form method="get" action="skjemabehandler.php"> <p>navn: <input type="text" name="navn" size="20"> </p> <p> <input type="submit" value="søk" name="sok"> <input type="reset" value="rensk" name="rensk"> </p> </form> Form-attributtet action inneholder URL til PHP-skriptet som skal behandle søket. Kommandoknappen med navn søk er av type «submit» nettleseren sender forespørselen når bruker klikker på knappen Inndata blir sendt til web-tjeneren som en sekvens av navn/verdi-par x1=v1, x2=v2,..., xn=vn

42 HTML-skjema III <form method="get" action="skjemabehandler.php"> <p>navn: <input type="text" name="navn" size="20"> </p> <p> <input type="submit" value="søk" name="sok"> <input type="reset" value="rensk" name="rensk"> </p> </form> Form-attributtet method styrer hvordan nettleseren sender forespørselen og er enten GET eller POST Med GET blir skjemadata overført som en URL-parameter (?navn=kari)

43 Behandle skjemadata <html> Navnet brukeren skriver <body> inn i nettside 1 blir altså <h1>kundedata</h1> vist fram i nettside 2. <?php $fornavn = $_GET["navn"]; print("<p>fornavn: ". $fornavn. "</p>");?> </body> </html> $_GET inneholder skjemadata når metode GET er brukt $_GET er en assosiativ tabell (parameter => verdi) Med GET er skjemadata synlig i URLen ( Vi kan ha bokmerker til «nettside med skjemadata» Vi kan teste nettsider uten å lage HTML-skjema

44 Metode POST Fordeler med POST Kan overføre større datamengder enn ved GET (~2000 tegn) $_POST er også en assosiativ tabell (parameter => verdi) Skjemadata er ikke synlig i URLen Hindrer at andre får tak i sensitiv informasjon ved å se på skjermen NB! Skjemadata blir ikke kryptert verken med GET eller POST Hvordan? <form method="post" action="skjemabehandler.php"> <input type="text" name="navn" size="20"> <input type="submit" value="søk" name="sok"> </form> I skjemabehandler.php: $fornavn = $_POST["navn"]; Bruker nok vanligvis POST i en HTML Form.

45 $_GET, $_POST og $_REQUEST Skjemadata blir altså overført i en assosiativ matrise Merk for øvrig at passord ikke blir kryptert $_GET = array ( "brukernavn" => "Ola", "passord" => "Hemmelig" ) De superglobale matrisene $_GET : skjemadata overført med metode GET $_POST : skjemadata overført med metode POST $_COOKIES : informasjonskapsler $_REQUEST : summen av $_GET, $_POST og $_COOKIES

46 Bruk av $_REQUEST POST-forespørsel: <form method="post" action="skjemabehandler.php"> <input type="text" name="navn" size="20"> <input type="submit" value="søk" name="sok"> </form> GET-forespørsel: Samme skript kan behandle begge typer av forespørsler: $fornavn = $_REQUEST["navn"];

47 Databasetabeller som assosiative tabeller En databasetabell består av et antall rader: $dbtab = array($rad1,$rad2,$rad3); Hver rad kan håndteres som en «mapping» fra kolonnenavn til verdi: $rad1 = array("nr"=>1, "navn"=>"per"); En databasetabell er altså en tabell av slike «mapping»-tabeller: $dbtab = array( array("nr"=>1, "navn"=>"per"), array(), ); Dette er i hvert fall én måte å representere databasetabeller på i PHP...

48 Databaseprogrammering i PHP For brukeren vil en web-applikasjon bestå av en antall nettsider. Fylle ut et skjema trykke «send» - applikasjon kvitterer med en ny side Vi kan produsere hver enkelt nettside med et eget PHP-skript. Et slikt skript kan være bygget opp slik: Åpne en forbindelse til databasen. Avles skjemadata som brukeren har skrevet inn. Bygg opp en SQL-spørring basert på inndata fra brukeren. Send SQL-spørringen til databasen for utførelse. Behandle spørreresultatet og skriv ut ny nettside (HTML). Lukk forbindelse til databasen. PHP-skript kan kommunisere med forskjellige databasehåndterings-systemer. Vi bruker her MySQL.

49 Databasedrevne web-løsninger med PHP Nettleser HTML-skjema Skjemadata 4 1 PHP utdata (HTML) Web-tjener PHP-motor 2 3 Spørre-resu ltat SQL DBHS Database Web-tjener er «tjener» mot nettleser og «klient» mot DBHS Skjemadata blir til SQL blir til spørreresultat blir til HTML 49

50 Opprette databaseforbindelse For å koble opp til en MySQL-tjener: Adressen til tjeneren (evt. localhost) Brukernavn Passord En MySQL-tjener kan inneholde flere databaser: Må velge database $forbindelse = mysql_connect("localhost","bruker","passord") ; mysql_select_db("test"); Lukke forbindelsen til databasen: mysql_close( $forbindelse ); // mysql_free_result

51 Utføre SELECT-spørringer Sender med SQL-spørringen som parameter til mysql_query: $sql = "SELECT * FROM Vare;"; $resultat = mysql_query( $sql ); Antall returnerte rader: $antall = mysql_num_rows( $resultat ); Hva inneholder $resultat? $resultat er av datatype resource; referanse til en ekstern ressurs Inneholder hele spørreresultatet Kan løpe gjennom spørreresultat med en løkke og hente ut verdier

52 Databaseforbindelse I kallet på mysql_query så er det underforstått at vi skal bruke databaseforbindelsen $forbindelse: $forbindelse = mysql_connect("localhost","bruker","passord"); mysql_select_db("test"); $sql = "SELECT * FROM Vare;"; $resultat = mysql_query($sql); Vi kan gjøre dette eksplisitt: $resultat = mysql_query($sql, $forbindelse); Dette gjelder flere av MySQL-funksjonen i PHP.

53 Bygge SQL-spørringer fra skjemadata Lagre skjemadata i PHP-variable: $sok = $_REQUEST["txtSok"]; Bygg SQL merk enkle og doble apostrofer og blanke tegn! $sql = "SELECT * FROM Vare ". "WHERE Betegnelse LIKE '". $sok. "%';"; Test: Skriv ut SQL-koden! print("<p>testutskrift:". $sql. "</p>");

54 Behandle spørreresultater I Anta $resultat er et spørreresultat med en kolonne Betegnelse: $linje = mysql_fetch_array($resultat, MYSQL_ASSOC); while ( $linje ) { $navn = $linje["betegnelse"]; print( $navn. "<br>"); $linje = mysql_fetch_array($resultat, MYSQL_ASSOC); } Alternativer: MYSQL_NUM, MYSQL_BOTH

55 Behandle spørreresultater II Det er ikke nødvendig å vite navnet på kolonnene: $linje=mysql_fetch_array($res, MYSQL_ASSOC)); while ($linje) { foreach ($linje as $verdi) { print($verdi. " "); } print("<br>"); $linje=mysql_fetch_array($res, MYSQL_ASSOC)); }

56 Fra spørreresultat til HTML-tabell Generelt blir dette en nøstet løkke Skriv ut <table> Hent første rad Skriv ut <tr> Hent første verdi Skriv ut <td> Skriv ut første verdi Skriv ut </td> (verdi 2, verdi 3, ) Skriv ut </tr> (rad 2, rad 3, ) Skriv ut </table>

57 UPDATE og DELETE Gir ikke et spørreresultat, men vi kan finne ut hvor mange rader som ble berørt: $sql = "DELETE FROM Vare;"; $resultat = mysql_query( $sql ); if ($resultat) print(mysql_affected_rows(). " rader ble slettet!"); else print("noe gikk galt!"); UPDATE og DELETE berører samtlige rader hvis vi ikke legger på en WHERE-betingelse!

58 INSERT Setter som regel inn 1 rad basert på skjemadata: $varekode = $_REQUEST["varekode"]; $betegnelse = $_REQUEST["betegnelse"]; $sql = "INSERT INTO Vare(Varekode,Betegnelse) ". "VALUES (". $varekode. "'". $betegnelse. "'". ");"; $resultat = mysql_query( $sql ); Merk: Apostrofer rundt tekstverdier, men ikke rundt tall Øvrige kolonner i den nye raden blir satt til NULL

59 Autonummerering I MySQL angis autonummerering som en kolonne-egenskap: CREATE TABLE Ansatt ( AnsNr INTEGER AUTO_INCREMENT, ); Kolonner som er autonummererte tas ikke med i INSERT INSERT INTO Ansatt(Fornavn, Etternavn) VALUES ('Per', 'Hansen'); Hvordan få tak i sist genererte ansattnr: mysql_query($sql); $sisteansnr = mysql_insert_id();