HTML Forms, CGI och HTTP. Översikt Innehåll – Presentation – Beteende HTML Forms (innehåll) CGI (beteende) HTTP (beteende)

En presentation över ämnet: "HTML Forms, CGI och HTTP. Översikt Innehåll – Presentation – Beteende HTML Forms (innehåll) CGI (beteende) HTTP (beteende)"— Presentationens avskrift:

1 HTML Forms, CGI och HTTP

2 Översikt Innehåll – Presentation – Beteende HTML Forms (innehåll) CGI (beteende) HTTP (beteende)

3 Webben i bild Webbläsare HTML Webbservrar

4 HTML-formulär

5 Forms Tutorials http://www.w3schools.com/html/html_forms.asp http://www.ling.gu.se/~lager/kurser/webtechnology/ forms.htmlhttp://www.ling.gu.se/~lager/kurser/webtechnology/ forms.html

6 CGI i praktiken

7 The Common Gateway Interface (CGI) The task of a web server is to respond to requests from client web browsers by returning output. Each time a request is received, the server analyzes what the request asks for, and returns the appropriate output. The two simplest ways, for the server, of doing this are the following: –if the request identifies a file stored on disk, return the contents of that file; –if the request identifies an executable command and possibly arguments, run the command and return its output CGI defines a standard way of doing the second.

8 Palindrom-exempel: HTML Palindrome Checker Palindrome Checker Enter a word and find out if it's palindrome:

9 Palindrom-exempel : Python #!/usr/local/bin/python import cgi form = cgi.FieldStorage() word = form["word"].value print "Content-type: text/html\n\n" print " " if word == word[::-1]: print " Yes, %s is a palindrome " %(word,) else: print " No, %s is not a palindrome " %(word,) print " "

10 Palindrom-exempel: Prolog #!/usr/local/bin/plcon -q -g main -s :- use_module(library(cgi)). main :- cgi_get_form(Arguments), member(word(Atom),Arguments), atom_chars(Atom,Charlist), format('Content-type: text/html~n~n', []), format(" "), ( reverse(Charlist,Charlist) -> format(" Yes, ~w is a palindrome! ",[Atom]) ; format(" No, ~w is not a palindrome... ",[Atom]) ), format(" "), halt.

11 Installation av CGI-skript på HAL Ditt CGI-skript installerar du så här: 1.Skapa ett underbibliotek 'cgi-bin' i ditt www-bibliotek. 2.Placera palindrome.py (eller palindrome.pl) i detta bibliotek. 3.Byt namnet på filen till 'palindrome.cgi'. 4.Kör kommandot chmod a+rx palindrome.cgi för att sätta nödvändiga läs- och skrivrättigheter. 5.Ändra värdet på attributet ’action’ i elementet ’form’ i filen ”palindrome.html” så att det passar din installation. 6.Logga in på http://www.cling.gu.se/admin/cgi/ för att aktivera ditt skript. 7.Provkör!

12 Ditt www-bibliotek www/ index.html css/ main.css cgi-bin/ palindrome.cgi kurser/ webbteknologi/ index.html...

13 Provkörning file://C:/www/kurser/Webteknologi/webtechnology/cgi_test/palindrome.html

14 HTTP

15 Hypertext Transfer Protocol Webbens kommunikationsprotokoll Exempel: Från läsaren till servern (request): GET 2004/Talks/0914-tbl-speech/text HTTP/1.1 Från servern till läsaren (response): HTTP/1.1 200 OK … Webbläsare HTML Webbservrar

16 Palindrom-exemplet igen… Testa i Firefox: http://localhost/cgi-bin/palindrome.py?word=apa Inspektera requests och responses m.h.a. verktyget LiveHTTPHeaders

17 HTTP request message GET /cgi-bin/palindrome.py?word=apa HTTP/1.1 Host: localhost User-Agent: Mozilla/5.0 (Windows; U; … Accept: text/xml,application/xml,... Accept-Language: en-us,en;q=0.5 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8… Keep-Alive: 300 Connection: keep-alive

18 HTTP request message GET /cgi-bin/palindrome.py?word=apa HTTP/1.1 Host: localhost User-Agent: Mozilla/5.0 (Windows; U; … Accept: text/xml,application/xml,... Accept-Language: en-us,en;q=0.5 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8… Keep-Alive: 300 Connection: keep-alive Data (if POST is used) request line (GET, POST,… commands) request headers extra carriage return, line feed) query

19 More about the query I webbläsaren: http://localhost/cgi-bin/palindrome.py?word=apa Request (en del av den): GET /cgi-bin/palindrome.py?word=apa HTTP/1.1 I CGI-skriptet –Hanteras oftast av ett bibliotek (library) och parsas och översätts där till en datastruktur där informationen blir lättåtkomlig

20 More about the query (cont’d) Ett sådan bibliotek har en del att göra: http://www.google.com/search?q=Torbj%C3%B6rn+Lager &client=firefox http://www.google.com/search?q=Torbj%C3%B6rn+Lager&ie=utf-8&oe=utf- 8&aq=t&rls=org.mozilla:en-US:official&client=firefox Det som webbläsaren gör här kallas för “url encoding” Så CGI programmet måste alltså utföra “url decoding” Tur att man sällan behöver bry sig!!

21 HTTP response message HTTP/1.x 200 OK Date: Mon, 18 Feb 2008 08:08:20 GMT Server: Apache/2.0.55 (Win32) Keep-Alive: timeout=15, max=100 Connection: Keep-Alive Transfer-Encoding: chunked Content-Type: text/html Yes, apa is a palindrome

22 HTTP response message HTTP/1.x 200 OK Date: Mon, 18 Feb 2008 08:08:20 GMT Server: Apache/2.0.55 (Win32) Keep-Alive: timeout=15, max=100 Connection: Keep-Alive Transfer-Encoding: chunked Content-Type: text/html Yes, apa is a palindrome status line (protocol, status code, status phrase) response headers data

23 HTTP response status codes A few sample codes: –200 OK request succeeded, requested object later in this message –404 Not Found requested document not found on this server –500 Internal Server Error something is wrong with the server, or (more likely) with your CGI script

24 Laborationen http://www.ling.gu.se/~lager/kurser/webtechnology/lab3.html