HTML Perl 2008-09

Understanding & Interlinking of HTML,
Perl, MySQL & Apache Web Server.
Shankar @ ISE
Introduction HTML
What is an HTML File?

– HTML stands for Hyper Text Markup Language
– An HTML file is a text file containing small markup tags
– The markup tags tell Web browser how to display the page
– An HTML file must have an .htm or .html file extension
– An HTML file can be created using a simple text editor
20 August 2008 shankar@ISE

First Simple Example (mypage.html)
<html>
<head>
<title>Title of page</title>
</head>
<body> This is my first homepage.
<b>This text is bold</b>
</body>
</html>
HTML Elements are HTML Tags
HTML tags are used to mark HTML elements

HTML tags are surrounded by the two characters < and >
The surrounding characters are called angle brackets
HTML tags normally come in pairs like <b> and </b>
The first tag in a pair is the start tag,
the second tag is the end tag
The text between the start and end tags is the element content
HTML tags are not case sensitive,
<b> means the same as <B>
HTML Element Example: <b>This text is bold</b>
HTML Basics
HTML Tag Body Tag
<html> … </html> <html>

<head>
<title>My First HTML Document</title>
Title Tag </head>
<body>
<title>My First HTML Document</title> text, images, and links
</body>
Head Tag Headers
<head> Six levels of header h1 to h6.

<title>My First HTML Document</title>
</head> <h1> This is header 1 tag </h1>

HTML Basics Cont…
Paragraphs <p> tag placed at the end.
<p> causes a line break & adds a trailing blank line

<br> causes a line break with no trailing blank line
Preformatted Text
<pre>this is
an example of a preformatted text tag</pre>
<b> boldface </b> tag
<i> italic </i> tag
<center> This is a centered sentence </center> tag
horizontal rule tag <hr>
Comments

HTML Basics Cont…
Lists
Unnumbered lists
<ul>
<li> list item 1
<li> list item 2
<li> list item 3
</ul>
Numbered lists
<ol>
<li> list item 1
<li> list item 2
<li> list item 3
</ol>
HTML Tables
<table summary=“” border=“” width=“” cellpadding=“” cellspacing=“”>

<tr>
<th>1990</th> <th>2000</th> <th>type</th> </tr>
<tr> <td>5.31</td> <td>4.2</td> <td>percent increase</td></tr>
<tr>
<td>$30,333</td> <td>$46,576</td> <td>hardwaresoftware</td>
</tr>
</table>
td table data
tr table row
th table header

HTML Forms
HTML Form is constructed using form element & containing other components such as:
buttons: used to submit the form or execute script code.

– eg: <button onclick="">Push Me</button>
textfields and password fields: single line inputs

– eg: <input type="text" size="20" value="YOUR NAME"/>
– eg: <input type="password" size="20"/>
check boxes and radio buttons: allow the user to say yes/no to a choice, or one
of several choices.
– eg: <input type="checkbox" checked/> Would you like monthly newsletter?
radio buttons: can be used to give an exclusive choice among several possible
options
– eg: <input type="radio" name="gender1" checked/> Male
<input type="radio" name="gender2" /> Female
HTML Forms Cont…
selection lists: these give a choice through a popup or scroll list
– eg: <select> <option value="1">dog</option>
<option value="2">cat</option>
<option value="3">cow</option> </select>
textareas: multi-line inputs

– eg: <textarearows="5" cols="20"></textarea>
Button as hyperlink
– eg: <button onclick="location='http://www.google.com'">Go to Google</button>
Image as hyperlink
– eg: <imgsrc="yahoo_out.gif" onclick="location='http://www.yahoo.com'"
onmouseover="src='yahoo_over.gif'" onmouseout="src='yahoo_out.gif'" />
Linking to other documents

– eg: <a href="http://www.google.com/">Welcome to Google</a>
HTML Example
<HTML> <HEAD>
<TITLE> Welcome to Google </TITLE>
</HEAD>
<BODY>
<h1> Welcome to Google </h1>
Welcome to the home page of Google
Professional.<p>
So how will we do this. Well we do the following
<ul>
<li><A HREF=“googlep.html">Burn</A> more
google.
<li>Best search engine <A
HREF="http://www.google.com/search.html“>
Application</A> layer.
<li>Birth of google<A
HREF="ftp:foo.do.do/google.gif“>Google</a>
</ul>
</BODY> </HTML>
Exercise on HTML

PERL (Practical Extraction & Reporting Language)
Perl is by far the most widely used language for CGI programming. It contains
many powerful features, and is very easy for the novice programmer to learn.
The advantages of Perl include:

– It is highly portable and readily available.
– It contains extremely powerful string manipulation operators.
– It contains very simple and concise constructs.
– It makes calling shell commands very easy.
– There are numerous extensions built on top of Perl for specialized functions;
for example, there is oraperl (or the DBI Extensions), which contains functions for
interfacing with the Oracle database.

Perl Cont…
# perl –v (installation version)
# perlprog.pl (execution)
Eg: print( "hello" );
print " world\n";
print "hello", " again", "\n";
print " hello " . " one " . " more " . " time " , "\n";
Variables
$foo # a scalar
@foo # a list
%foo # a hash
Eg: $n = 42; $name = “shan"; $color = 'red'; print $name + $color;
$real_result= $boolean_result? 1 : 0;
@scores = (32, 45, 16, 5);
%favorite = (shan=> 'red', sam=> 'blue');
$scores[2] # an element of @scores
$favorite{shan} # a value in %favorite
Perl Cont…
scalar values
$days # the simple scalar value "days"
$days[28] # the 29th element of array @days
$days{'Feb'} # the 'Feb' value from hash %days
entire hashes
%days # (key1, val1, key2, val2 ...)
entire arrays or array slices

@days # ($days[0], $days[1],... $days[n])
@days[3,4,5] # same as @days[3..5]
@days{'a','c'} # same as ($days{'a'},$days{'c'})
list values @abc= ("cat", "dog", $def);
hash values
$abc{'December'} = 12;
$month = $abc{'December'};
Perl Example
#!/usr/local/bin/perl
# addition.pl
# A simple addition program
print "Please enter first number:\n";
$number1 = <STDIN>;
chomp $number1;
print "Please enter second number:\n";
$number2 = <STDIN>;
chomp $number2;
$sum = $number1 + $number2;
print "The sum is $sum.\n";
Perl (Operators)
# logical_operators.pl
print "truth value of (2 == 2) = ", (2 == 2), "\n"; ;
print "truth value of (1 == 2) OR ( 1==1) = ", (1 == 2 or 1==1), "\n";
The ? Operator
eg: $val= 5; print ( $val== 5 ? "valequals 5\n" : "valdoesn't equal 5\n" );
File operators:
-f filename # tests if file exists
-d , -x, -w
Eg: # file.pl
print "Enter file/directory name:\n";
$filename = <STDIN>;
chomp $filename;
print "$filename ", -f $filename ? "IS a file\n" : "is NOT a file\n";

Perl (Operators) Cont…
control flow:
if (EXPR) BLOCK [ converse of if is unless ]
if (EXPR) BLOCK else BLOCK
if (EXPR) BLOCK elsif (EXPR) BLOCK ... else BLOCK
while (EXPR) BLOCK
while (EXPR) BLOCK continue BLOCK
for (EXPR; EXPR; EXPR) BLOCK
foreach VAR (LIST) BLOCK
loop control via next, last, and redo
eg: if ($model <= 3000) { $os= 'mpe' };

foreach $number ( @array ) { $number **= 2; }
Assignment operators:
$a += 2; is equivalent to $a = $a + 2;
**= += *= &= <<= &&= -= /=
|= >>= ||= .= %= ^= x=
Perl (Operators) Cont…
numeric comparisons:
< > <= >= == != <=>
<=> returns -1, 0, or 1 depending on whether the left argument is numerically less
than, equal to, or greater than the right argument
string comparsions:
lt gt le ge eq ne cmp
cmp returns -1, 0, or 1 depending on whether the left argument is stringwise less
than, equal to, or greater than the right argument
Bitwise operators: shift left: << , shift right: >>, AND: &, OR: |, XOR: ^, negation: ~
Command Line Arguments:

Eg: # input.pl
$first_arg= shift @ARGV;
$second_arg= shift @ARGV;
print " $first_arg x $second_arg= ", $first_arg * $second_arg, "\n“;
Perl (Subroutines)
Eg: # subroutine.pl
sub max {
my $max = shift(@_);
foreach$foo(@_) {
$max = $fooif $max < $foo; }
return $max;
}
$bestday= max($mon,$tue,$wed,$thu,$fri);
parameters passed via @_array

@_[0] = parm1, @_[1] = parm2, etc
@_ is an alias (i.e. call by reference)
private variables declared with my

the value of the last expression is the functional return value

Perl (Some Functions)
scalar(@array) length of an array
Index count: $#
Eg: @nums=(…);
print $#nums;
slice of an array splice

splice (array, offset, length, list)
Eg: @words = ('The', 'quick', 'brown', 'fox', 'jumped');
@spliced = splice(@words, 1, 2, 'happy', 'red');
print "spliced words = @spliced\n"; # quick brown
push(@array, x, y)
pop(@array)

Perl (Some Functions) Cont…
reverse(@array)
sort(@array)
lc($var)
split
Eg: # spliting.pl
$alphabet = "ABCDEF";
@words = split(//, $alphabet); # @words = ('A', 'B', 'C', 'D', 'E', 'F')
Join
Eg: # joining.pl
@words = ('The', 'quick', 'brown', 'fox', 'jumped');
print join("+", @words), "\n“; # The+quick+brown+fox+jumped
Perl (Hashes)
# hashes.pl
# create a lookup table of Ciphertext
# keyed by Cipher ID
%accession_hash=
( "BACR01A01" => "AC005555",
"BACR48E02" => "AC005577",
"BACR24K17" => "AC005101", );
# get all the keys in the hash (hash is keyed by Cipher ID)
@cipher = keys %accession_hash;
print “Cipher IDs: @cipher\n";
# prints BACR01A01 BACR48E02 BACR24K17
# get all the values in the hash (hash is a lookup for accessions)
@accs= values %accession_hash;
print “Ciphertexts: @accs\n";
# prints AC005555 AC005577 AC005101
Perl (Files)
open (HANDLE, "/file/path") -open for reading
open (HANDLE, "< /file/path") -open for reading
open (HANDLE, "> /file/path") -open for writing
open (HANDLE, ">> /file/path") -open for appending
open (HANDLE, "| shell command") -open pipe for writing
open (HANDLE, "shell command |") -open pipe for reading
Eg:#openfile.pl
$data_file=“shank.cgi";
open (F, $data_file) || die ("Could not open file!");
@raw_data=<F>;
close(F);
Arguments are passed into functions through special array @_
Last element of the array $#_

Exercise on PERL

CGI Web Server
A computer program that allows web servers to forward requests for

processing to other programs, which then return their results to the web server.
Serving up Static Data

Serving up Dynamic Data
GET and POST Method
POST
– Query length can be unlimited (unlike in GET)
– Is used to send a chunk of data to the server to be processed
– You can send entire files using post
– Your form data is attached to the end of the POST request (as opposed to the
URL)
– Not as quick and easy as using GET, but more versatile (provided that you are
writing the CGI directly)
GET
– Your entire form submission can be encapsulated in one URL
– You can access the CGI program with a query without using a form
– Fully includes it in the URL:
http://myhost.com/mypath/myscript.cgi?name1=value1&name2=value2
– Is how your browser downloads most files
– Don't use GET if you want to log each request
– Is used to get a file or other resource

GET & POST Examples:
GET:
<FORM NAME="myform" ACTION=“http://localhost/cgi-bin/prog.cgi" METHOD="GET">
First Name: <INPUT TYPE="TEXT" NAME="fname" SIZE="20“><BR>
Last Name: <INPUT TYPE="TEXT" NAME="lname" SIZE="20"><BR>
<INPUT TYPE="SUBMIT" VALUE="SUBMIT">
</FORM>
POST: Replace the METHOD=“POST”

Form Interaction With CGI

Example for GET
# perl_prog.pl
#!/usr/bin/perl
print "Content-type: text/html", "\n\n";
$query_string= $ENV{'QUERY_STRING'};
($field_name, $command) = split (/=/, $query_string);
#Html program
<HTML>
<HEAD><TITLE>Simple Form!</TITLE></HEAD>
<BODY> <H1>Simple Form!</H1> <HR>
<FORM ACTION="/cgi-bin/perl_prog.pl" METHOD="GET">
Command: <INPUT TYPE="text" NAME="command" SIZE=40>
<P>
<INPUT TYPE="submit" VALUE="Submit Form!">
<INPUT TYPE="reset" VALUE="Clear Form">
</FORM> <HR> </BODY> </HTML>

Apache Web Server
Apache is primarily used to serve static and dynamic content on the WWW.
Installation
# yum install httpd
/etc/httpd/ (config files)
/etc/init.d/httpd (startup config file)
/var/www/ (root files)
Configuration (/etc/httpd/conf/httpd.conf) [ Optional -> Only if programs don’t work ]
ServerName www.example.com:80 (localhost:80) Uncomment
<CGI Directory> …. Options None(ExecCGI) … </D>
AddHander cgi-script .cgi( .pl ) Uncomment
Starting, Stoping& Restarting Apache (w.r.t root)
# service httpd start or /etc/init.d/httpd start
# service httpd restart or /etc/init.d/httpd restart
#service httpd stop or /etc/init.d/httpd stop
Checking for exisiting httpd server
# rpm –q httpd

Apache & HTML
Check for test page:

http://localhost
All html files need to be saved in

/var/www/html directory (for Fedora Core)
/srv/www/htdocs directory (for SuSe)
Eg: # hello.html
<html> “Hello World” </html>
http://localhost/hello.html

Apache & Perl
All perl files need to be saved in
/var/www/cgi-bin directory (for Fedora Core)
/srv/www/cgi-bin directory (for SuSe)
Eg: #hello.pl or hello.cgi

#!/usr/bin/perl
print “Content-type: text/html\n\n”;
print “Hello World\n”;
Execution permission
# chmod +x hello.cgi
Command prompt execution

# perl hello.cgi
Browser
http://localhost/cgi-bin/hello.cgi
Programs
Html: To display UNIX output
//prog1b.html
<html>
<head>
<title>Command Execution</title>
</head>
<body bgcolor=\"red\">
<form action="http://localhost/cgi-bin/prog1b.pl" method="GET">
<h1>Command Execution:</h1><hr>
Enter the Command: <input type="text" name="cmd" ><br>
Submit: <input type="submit "value="submit">
</form>
</body>
</html>

Perl Code: To display UNIX output
//prog1b.pl
#!/usr/bin/perl
print"Content-Type:text/plain","\n\n";
print"Result of the Command:","\n\n";
$query_string = $ENV{'QUERY_STRING'};
($field_name,$command) = split(/=/,$query_string);
print `$command`;

HTML Perl 2008-09

Uploaded by

Copyright:

Available Formats

You might also like

HTML Perl 2008-09

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

HTML Perl 2008-09

Uploaded by

Copyright:

Available Formats

Understanding & Interlinking of HTML,

Perl, MySQL & Apache Web Server.

What is an HTML File?

20 August 2008 shankar@ISE

HTML tags are used to mark HTML elements

<html> … </html> <html>

Head Tag Headers

<head> Six levels of header h1 to h6.

20 August 2008 shankar@ISE

<p> causes a line break & adds a trailing blank line

<b> boldface </b> tag

<i> italic </i> tag

<center> This is a centered sentence </center> tag

horizontal rule tag <hr>

<table summary=“” border=“” width=“” cellpadding=“” cellspacing=“”>

20 August 2008 shankar@ISE

buttons: used to submit the form or execute script code.

textfields and password fields: single line inputs

textareas: multi-line inputs

Linking to other documents

20 August 2008 shankar@ISE

The advantages of Perl include:

– It contains extremely powerful string manipulation operators.

– It contains very simple and concise constructs.

– It makes calling shell commands very easy.

20 August 2008 shankar@ISE

entire arrays or array slices

list values @abc= ("cat", "dog", $def);

20 August 2008 shankar@ISE

eg: if ($model <= 3000) { $os= 'mpe' };

Command Line Arguments:

parameters passed via @_array

private variables declared with my

20 August 2008 shankar@ISE

slice of an array splice

20 August 2008 shankar@ISE

Arguments are passed into functions through special array @_

Last element of the array $#_

20 August 2008 shankar@ISE

20 August 2008 shankar@ISE

A computer program that allows web servers to forward requests for

Serving up Static Data

20 August 2008 shankar@ISE

POST: Replace the METHOD=“POST”

20 August 2008 shankar@ISE

20 August 2008 shankar@ISE

20 August 2008 shankar@ISE

20 August 2008 shankar@ISE

Check for test page:

All html files need to be saved in

20 August 2008 shankar@ISE

Eg: #hello.pl or hello.cgi

Command prompt execution

20 August 2008 shankar@ISE

20 August 2008 shankar@ISE

You might also like