Transcript Lectr4

Approaches for creating dynamic web pages
Server-side processing:
Server receives a request, performs all processing necessary
to create a dynamic web page, sends the finished page to
client for display.
Client-side processing:
Some processing is done on client side e.g validation,
animation, changing colours, opening new windows etc.
Web Technologies
Server-side processing
CGI programs (Any language)
Compiled Programs - ISAPI, NSAPI,
Servelets
Server side includes (SSI)
Server-side scripts
Shell, JavaScript, Perl, VBScript,
Active Server Pages (ASP), Java server
pages (JSP)
Client-side processing
Compiled Programs - Applets, ActiveX
programs
Using Document Object Model (DOM)
with:
JavaScript
VBScript
Common Gateway Interface (CGI)
How Web Server Works?
Listening port - a daemon.
Text commands from user agents.
Example: GET index.html
If index.html needs to display other files (e.g. images), the
browser generates additional requests for each additional
file and on receipt, combines them and displays.
Example: Get /index.html
Get /image1.gif
Get /image2.gif
Web Server and CGI
Browser sends requests that are implemented by server.
HTTP protocol used by the web is mostly one way street.
Bulk of data travels from server to the browser (text,
graphics, sounds, applets, movies etc.). This is called
Response path. Only a small amount of data flows in the
other direction, called the Request path.
Client
Server
Where CGI fits in?
Request path contains “Get” requests but some additional data
also flows in this path: details about browser, user domain, and
depending on method, data relating to fields in a form.
When a server gets a request to run a CGI program, it collects
the necessary data sent from the client, starts the CGI program
and passes on the relevant data to it.
There are two ways the data travels from the client to the
server and then to the CGI program.
GET method and
POST method.
Understanding the Get Method
In GET method, the data from the fields of a form are sent to the
server as part of the URL.
E.g. http://www.mydomain.com/cgi-bin/pgm1.cgi?subject=xyz
The text after ? Is the data meant for the CGI program (pgm1.cgi).
The server packs the data in an environment variable called
QUERY_STRING. Additional data about browser and its defaults
are also packed in other environment variables that are made
available to the CGI program.
It is the job of the CGI program to separate the relevant data from
environment variables and take required action.
One of the ways to do that is to use Perl script to pick apart “parse” individual pieces of information in QUERY_STRING.
This information is in name = value pairs, each pair separated by
&. ‘+’ is used for space and some other hexadecimal characters for
control sequences.
Understanding the Post Method
In this method no data is sent as part of the URL. All data is
sent to the server via the requester path. Information from
fields of a from is sent as name-value pairs. The server
collects data in environment variables and the makes it
available to the CGI program in the form of STDIN or
standard input. It is the job of this program to parse the
information contained in the standard input and use it as
required.
Some Environment variables:
HTTP_ACCEPT: image/gif, image/jpeg (types of files that
the browser can accept)
HTTP_USER_AGENT: contains info about browser.
QUERY_STRING: name=George&birthmonth=May
REMOTE_ADDR, REQUEST_METHOD,
SCRIPT_NAME, SERVER_PORT, etc.
Server Side Includes (SSI)
Provide simple information as part of original page.
Does not provide real interactivity.
SSI directives are included in the HTML page, enclosed
within comment tags
<!--#directive argument=“value”-->
The following formats are incorrect:
<!-- #directive argument=“value”-->
<! --#directive argument=“value”-->
< !--#directive argument=“value”-->
Server Side Includes (SSI)
Some directives:
Command
Argument
#echo
var
Displays the
contents of environment
variable.
#fsize
file
Displays file size
#flastmod
file
When it was modified
#exec
cmd
Executes command
cgi
Executes cgi pgm.
System administrators do not like to enable SSI on servers
SSI Example
<html>
<head><Title> Test page</Title></head>
<Body>
<P>This page is to test working of SSI and Perl</p>
<H2> Your Browser is: </h2>
<!--#echo var="HTTP_USER_AGENT" -->
<h2> Remote address is:</h2>
<!--#echo var="REMOTE_ADDR" -->
<p> (Last modified <!--#flastmod file="test.shtml" --></P>
</body>
</html>
How to make web pages interactive?
We discussed SSI. Server needs to know if it should go
through a page requested by the browser or just send it
without scanning. SHTML extension required for SSI.
SSI do not make a page interactive.
One of the common ways is to use Perl Script on server
side. It is the job of this script to interpret if some
information was received in the query string and get any
required information, convert it to html and pass it to the
server for onward transmission to the browser.
Introduction to Perl
We shall look at two examples to have some idea of how
Perl Script works.
Like SSI, the browser needs to know if it should send the
requested file without any further action or take some
action. In this case to call perl program and pass info to it.
Extension .pl required.
First.pl
forms.pl
Your server does not have perl engine on it.
Introduction to Perl
Perl was first released in 1987
Developed by Larry Wall
Very powerful and elaborate textual pattern matching
Most widely used language for CGI programming
Need a Perl language processing system
Perl has been ported to Many versions of UNIX and
Windows.
Perl Variables
Three categories:
Scalar variables identified by '$' as first character of their names.
Following the $, they must have at least one letter. Letters are
case sensitive and by convention user-defined names are lower
case. $name, $u3, $age etc.
$age=35; #Assignment statement
"Smith is $age years old" => "Smith is 35 years old"
Can store 3 kinds of values: numbers, strings and references.
Not declared explicitly - compilers declares implicitly when it
first encounters it. (except local variables inside a function)
Keyboard input: $input = <STDIN>
Built-in functions: chomp($input = <STDIN>)
Perl Variables
Perl has a number of predefined variables called the implicit
variables often consisting of one or more special characters.
E.g. underscore '_',circumflex '^' etc.
It has usual control structures like: if, while, for, foreach etc.
While (STDIN)
{
print; #what?
chomp; #What is the argument to the function?
if ($_ eq "yes")
{print "Thanks for your consent";
}
}
Array variables identified by '@' as first character of their
names.
Hash variables identified by '%' as first character of their
names. They are also called associative arrays.
pack function
The web browser encodes special characters like !, *, ?, .
Or \ etc. into the form %xx where xx is a pair of
hexadecimal digits. The pack function uses a pattern 'C' to
convert the number back to a character. (other patterns do
exist).
$ch = pack ("C", hex("2B"));
Converts 2B into decimal 43 to character +.
$ch = pack ("C", hex("21"));
Converts 21 into decimal 33 to character !
Pattern Matching
The pattern to be matched is delimited by slashes //. By default
the string against which the matching is attempted is in the
implicit variable $_.
E.g: /k600/ tries to find k600 in the string contained in $_
/snow./ looks for strings starting with snow plus any other
character at the end - snowy, snowe, snowd etc.
You can specify a class of of characters for a match
[abc] matches 'a', 'b', or 'c'.
[a-h] matches any letter from 'a' to 'h'.
'^' inverts the specified set e.g. [^aeiou] matches consonants
only.
Predefined character classes: \d, \D, \w, \s
Binding Operators
If you want to match a pattern against a string contained
in a variable other than $_ you need to bind that variable
by using ~ operator.
$string = ~ / \d/; looks for a digit in $string
Remembering Matches
The part of a string that matched a part of a pattern can be
saved for later use by placing parenthesis around the
pattern. The sub-string that matches the first parenthesized
part of the pattern is saved in a variable $1, the next in $2
and so on.
"22 May 2002" =~ /(\d+) (\w+) (\d+)/;
print "$2 $1, $3 \n";
Will print on the screen:
May 22, 2002
Substitution
A part of the string contained in $_ variable by default can be
replaced by :
s/Pattern/New_string/
$_ = "it is not raining today";
s/is not/ isn't/;
In order to match a hexadecimal number one could use:
/%[\dA-Fa-f]/
If we want to save the number found, we should use ():
/%([\dA-Fa_f])/
The number found is saved in the implicit variable $1.
We can convert it to a character by using pack function:
pack("C", hex($1));
s/%([\dA-Fa_f])/pack("C", hex($1))/e;
Transliterate operator
The operator "tr" translates a character or character class to
another character or character class respectively.
tr/;/:/;
Translates all ; with : in $_.
Note: the last ; is a statement terminator.
tr/A-Z/a-z/;
Converts all upper case letters to lower case
letters.