webuppgift - uppsala university...steg 2: lägg till py-filer •därmed är apache konfigurerat....

45
Webuppgift

Upload: others

Post on 04-Jun-2020

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Webuppgift

Page 2: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Dagens föreläsningar

•HTTP och hur kontakten sker mellan klient och server.

••Apache-servern

••HTML.

••Exekvera Pythonscript.

••Formulär.

••Model-View-Controller på webben.

••CSS.

••Presentation av uppgiften.

••ORM och Zope.

••Django.

Page 3: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Lagerdesign för webbkommunikation

• Tre lager (förenklat).

•• Klient och server kommunicerar via protokollet HTTP, HyperText Transfer Protocol.

•• HTTP är tillståndslöst, varje förfrågan behandlas separat.

Page 4: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Ställa in Apache för Python

• Då WAMP installeras väljs en mapp som är rotkatalog för servern.

•• Standardinställningen är {sökväg till WAMP}\www till exempel c:\program\WAMP\www.

•• För att testa servern anges adressen http://localhost i en webbläsare.

Page 5: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Skapa en statisk sida.

• HTML-koden sparas som test01.html i mappen www\python.

•• Adressen blir därmed http://localhost/python/test01.html.

Page 6: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Skapa ett Pythonscript

• Pythonkoden sparas som script01.py i mappen www\python.

• Adress: http://localhost/python/script01.py.

Page 7: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Exekvera Pythonscript

• Om vi inte talar om för Apache att Pythonscript ska exekveras kommer de att visas som vanliga textfiler.

•• Steg 1: Lägg till exekvering av script för rotkatalogen.

•• Steg 2: Tala om att py-filer är exekverbara script.

Page 8: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Steg 1

<Directory "C:/Program/wamp/www">## Possible values for the Options directive are "None", "All",# or any combination of:# Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews## Note that "MultiViews" must be named *explicitly* --- "Options All"# doesn't give it to you.## The Options directive is both complicated and important. Please see# http://httpd.apache.org/docs/2.2/mod/core.html#options# for more information.#Options Indexes FollowSymLinks ExecCGI## AllowOverride controls what directives may be placed in .htaccess files.# It can be "All", "None", or any combination of the keywords:# Options FileInfo AuthConfig Limit#AllowOverride all## Controls who can get stuff from this server.## onlineoffline tag - don't removeOrder Deny,AllowDeny from allAllow from 127.0.0.1</Directory>

Page 9: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Steg 2: Lägg till py-filer

• Därmed är Apache konfigurerat.

•• Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta är det enklaste.

# AddHandler allows you to map certain file extensions to "handlers":# actions unrelated to filetype. These can be either built into the server# or added with the Action directive (see below)## To use CGI scripts outside of ScriptAliased directories:# (You will also need to add "ExecCGI" to the "Options" directive.)#AddHandler cgi-script .cgi .py</Directory>

Page 10: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Felmeddelanden

• Studera följande kod som innehåller ett fel:

• Då detta exekveras visas allt som genererats fram till felet.

•• Ingen information om felet visas.

#!d:/program/python25/python.exeprint "Content-type: text/html\n"print "<p>Hej</p>"priprint "Hej igen"

Page 11: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Skriv ut information

• Lägg till raden import cgitb; cgitb.enable().

Page 12: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Uppmärkningsspråk

• Uppmärkningsspråk används för att märka innehållet i en textfil.

•• Märkningen är abstrakt. Man talar om att en text är en rubrik, inte hur rubriken ska se ut.

•• SGML, Standard Generalized Markup Language, är ett metaspråk för uppmärkning. Används inte lika mycket som sina derivat.

•• XML, eXtensible Markup Language, är en förenklad variant av SGML som förenklar arbetet att implementera en parser.

• XML används som bas för många olika standardformat såsom XHTML, SVG, RSS och SOAP.

•• HTML, HyperText Markup Language, baserades från början på SGML men implementerar inte dess strikta krav på uppmärkningen.

Page 13: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Introduktion till HTML

• Som vi redan sett består HTML av ett antal "taggar" som beskriver vad texten inuti taggarna är för typ av text.

•• Taggar skrivs <tagnamn> … </tagnamn> eller <tagnamn/>.

•• Varje HTML-dokument bör börja med en <html/>- tag.

•• Därefter följer en <head/>-tag som innehåller metainformation om dokumentet.

•• Sist kommer <body/>-taggen som innehåller själva innehållet.

•• HTML skiljer inte på stora och små bokstäver men w3 rekommenderar användandet av små bokstäver.

Page 14: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta
Page 15: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta
Page 16: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Attribut för taggar

• Taggar kan ha attribut som anges med namn och värde.

Page 17: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Bilder

Page 18: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Länkar

Page 19: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• Formulär används för att skicka information från klienten till servern.

• Eftersom HTTP är tillståndslöst måste kommunikationen ske i flera steg.

•• Steg 1: Servern skickar ett formulär till klienten.

•• Steg 2: Användaren fyller i formuläret och klickar på "Skicka in"-knappen.

•• Steg 3: Servern tar emot informationen från formuläret och utför något beroende på innehållet.

•• Steg 4: Oftast skickar servern tillbaka någon form av information som meddelar vad som hänt med informationen.

Formulär

Page 20: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• Ett formulär innesluts av <form/>-taggen och kan innehålla valfritt antal <input/>-taggar.

•• action-attributet anger vilket script som ska hantera formuläret.

•• method-attributet styr hur informationen skickas till det mottagande scriptet.

•• Varje <input/>-tag har en typ och ett namn.

Exempel med formulär

<html><body>

<h1>Litet formul&auml;rexempel</h1><p>Fyll i vad du heter och vilket &aring;r du &auml;r f&ouml;dd:</p><form action="handleform01.py" method="get">

<input type="text" name="fullname" /><br/><br/><input type="text" name="year" /><br/><br/><input type="submit" value="Behandla formul&auml;r" />

</form></body></html>

Page 21: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Formuläret i webbläsaren

Page 22: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Hanteraren

Page 23: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• Vissa tecken har särskilda betydelser i HTML och måste därför skrivas som "escapekoder".

Särskilda tecken

>>> import cgi>>> cgi.escape("<>åäöÅÄÖ%&?")'&lt;&gt;\x86\x84\x94\x8f\x8e\x99%&amp;?'

Page 24: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• HTML:s "luddighet" gör det olämpligt som format för datalagring.

•• Försök har gjorts och görs för att strama upp HTML, exempelvis XHTML-validering.

•• Det är bättre att spara data i ett rigoröst definierat format, exempelvis XML, och sedan omvandla det till HTML när det ska skickas till en klient.

Andra uppmärkningsspråk

Page 25: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• HTML har taggar som styr innehållets utseende, exempelvis <b/> och <i/>.

•• Typsnitt kan detaljstyras med <font/> och tabeller kan ges en specifik layout genom attributinställningar.

•• Genom att blanda layout och innehåll bryter vi mot designmodellen Model-View-Controller (MVC).

•• En bättre lösning är att ange layout separerat från HTML-dokumentet.

Layout för strukturerade dokument

Page 26: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• Cascading Style Sheets är ett sätt att definiera en design separat från ett HTMLdokument.

•• Används ofta i kombination.

CSS

Page 27: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

HTML-koden

Page 28: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

CSS-koden

Page 29: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Utan CSS

Page 30: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Med CSS

Page 31: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• Uppgiften består i att skapa ett bokningssystem för en tandläkarmottagning.

• Instruktioner och detaljer kring redovisningen finns på kurshemsidan.

Inlämningsuppgiften

Page 32: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• Mottagningen har öppet kl 8-17 måndag till fredag, förutom kl 12-13 då den är lunchstängd.

•• Varje behandling startar på hel timma och pågår 60 minuter.

•• Det räcker om prototypen kan hantera en enda vecka.

•• Det ska finnas en startsida där patienterna hittar länkar till sidor för olika ändamål.

•• När en patient ska boka en tid bör det finnas en veckoöversikt, där det framgår vilka tider som är lediga.

•• En patient bör kunna få upp en förteckning över sina bokade tider, där det är möjligt att avboka besök vid behov.

•• Tandläkaren ska ha en egen ”vy” av veckoöversikten, där hon kan se alla bokade tider och där patientens namn och typen av behandling (undersökning, lagning, rotfyllning med mera) framgår.

•• I övrigt är uppgiften relativt fri. Tveka inte att experimentera.

•• Det viktiga är att öva programmering, inte få till en optimal bokningstjänst.

Förutsättningar

Page 33: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

• Inlämningsuppgiften nivå 1, får skrivas i Python, PHP, Perl eller Ruby.

•• Nivå 2 får skrivas i Django, Zope, Ruby on Rails eller motsvarande ramverk i något av ovanstående språk.

• Inga "färdiga" bokningssystem får användas.

•• För andra kombinationer än Python+Jango kan jag tyvärr endast erbjuda begränsad handledning.

Val av språk

Page 34: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Valet är fritt:

• Relationsdatabas (MySQL, SQLite).

• Textfil.

• Binär fil.

• pickle/shelve

• ORM.

Val av lagringsmodell

Page 35: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Objektsdatabaser

• Relationsdatabaser är bra för stora mängder homogen data.

•• Mindre bra för komplexa, heterogena datamängder.

•• För dessa fall kan objektsdatabaser (ODBMS/OODBMS) vara en bra lösning.

Page 36: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Objektsdatabaser

• Fördelar:––Enkelt att spara objekt från exempelvis Python. Inga extra steg krävs för att spara data från objektorienterade applikationer.

• Nackdelar:––Få standarder.––Få verktyg.––Inbyggd motsättning mellan OOP:s inkapsling av data och databasers datacentrerade perspektiv.

––Sämre prestanda än relationsdatabaser.

Page 37: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Mappning

• En hybridlösning är att skapa en mappning mellan objekt i en applikation och tabeller i en relationsdatabas.

•• Klasser motsvaras av tabeller och attribut av kolumner.

•• Denna process kan enkelt automatiseras.

• Detta har gjorts med stor framgång i exempelvis Zope Object Database och Active Records i Ruby on Rails.

Page 38: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Object publishing

• Alternativt sätt att hantera server-side scripting.

•• CGI-programmering tenderar att resultera i stort fokus på generering av rätt text att skicka tillbaka till klienten.

•• Object publishing innebär att steget från webbadresser till funktions- och metodanrop automatiseras.

Page 39: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Zope

• Zope är ett ”web publishing framework”.

•• Zope är skrivet i Python.

• Består av flera komponenter. De viktigaste är:––Zope Object Request Broker (Zope ORB)––HTML mallar. Separerar logik och layout.––Object database. Bygger på samma teknik som shelve, men stöder även bland annat transaktioner och samtidig dataaccess.

Page 40: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Zope ORB

• Agerar mellanhand mellan CGI-världen och Pythons objektvärld.

Page 41: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Zope ORB ”översätter” URL:er

• En URL (Uniform Resource Locator) anger hur ett objekt eller en tjänst lokaliseras på Internet.

•• Zope ORB översätter en URL till metodanrop för objekt:

http://server/path/mod/obj1/obj2/met_name?arg1=val1&arg2=val2

•• Detta översätts av ZORB:en på server till ett Pythonanrop för ett objekt i sökvägen path: mod.obj1.obj2.met_name(arg1=val1,arg2=val2)

Page 42: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Zope ORB fortsättning

• Svaret som skapas av Pythonkoden omformateras av Zope (mha HTML-mallar) till HTML och skickas tillbaka till klienten.

•• Klienten märker ingen skillnad. HTML-kod från statiskt innehåll och dynamiskt innehåll, oavsett om det genereras av Pythonscript via CGI direkt eller via Zope, ser likadant ut då det når klienten.

Page 43: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta

Django och Rails

• Webbramverk som levereras med en egen webbserver för snabb och enkel utveckling.

•• Kräver få andra programvaror vilket gör det lättinstallerat.

•• http://www.djangoproject.com

•• http://www.rubyonrails.org

Page 44: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta
Page 45: Webuppgift - Uppsala University...Steg 2: Lägg till py-filer •Därmed är Apache konfigurerat. ••Det finns andra (bättre) sätt att exekvera Pythonscript i Apache men detta