Learning Center
Plans & pricing Sign in
Sign Out

What is CGI


									    Building CGI Scripts

              By Anchi GUO

Faculty of Pharmacy & Pharmaceutical Sciences
 University of Alberta, Edmonton, AB T6G 2N8
               November 28, 2002

•   What is CGI?
•   How does it work
•   Basic Perl
•   Basic HTML
•   CGI sample scripts
•   Debugging
              What is CGI
• The Common Gateway Interface
• The method by which a web server can
  get data, and display that data to users via
  the web
• CGI can output dynamic information
• A CGI can be written in any programming
  language (ex. C/C++, C Shell, Perl, VB)
        How Is CGI Used?

• Sending Email
• Processing forms (ex. Order form)
• Generating website (ex. CyberCell
• …
          How does CGI work?

Web Browser               Server                 Application
 (on client)                                      (on server)

               1. HTTP             2. Call CGI

   User        4. HTTP             3. CGI
               response            program‘s
Sample Script:

print "Hello, world!\n";

Tells the server that this is a Perl script, and
  where to find the Perl interpreter

print "Hello, world!\n";
Output ―Hello, world‖ on the screen
            Perl Variables
• What is a variable?
  A variable is storage place, where a value
  can be stored for use by a program.
• 3 Perl variable types
     - scalar
     - array
     - hash
• Is Perl ‗s simplest and most common data
• Replaces many of the common data types
  that other languages use
• Stores a single item: integer, floating point
  number, string, or Boolean value
• Begins with a dollar sign ($)
      $name, $age
• An array is a variable that stores multiple
  scalar values

• The entire array can be referenced as a
  single variable

• Array variables start with @
  - @name
  - @PDB_code
             Array (continued)
• Position       0        1      2

     @name      John   Peter   Eric

• Single element
     $name[0]          value: ―John‖
     $name[1]          value: ―Peter‖
     $name[2]          value: ―Eric‖
• Is also called associative array
• Is like normal arrays
• Is indexed by string (key)
• Consists of pairs of elements
         – a key and a value
• Provides very fast lookup of the value
  associated with a key
• Start with % ----- %marks, %age
          Hash (continued)
• Individual element
                             Key     %age
                             John     8
 $age{John}    8
 $age{Peter}   10   Values   Peter   10
 $age{Eric}    5
                              Eric    5
             Basic HTML
• HyperText Markup Language

• HTML is the language used to prepare
  hypertext document.

• Web browsers are used to view HTML
  documents and display data to users
             HTML Document
<head><title>Test Page</title></head>
<b>Hello, world</b>

Document Structure
- Head
- Body
              HTML Tags
• HTML tags are commands, they tell the
  browser how to display the text.

• There are opening and closing versions for
  many tags

     opening tag: <HTML>
     closing tag: </HTML>
        HTML Tags (continued)
• <HTML></HTML> For identifying a text document as an HTML
• <HEAD></HEAD> For creating the head section of page
• <BODY></BODY> For enclosing the main section of page
• <B></B>       For displaying text in boldface
• <I></I>       For displaying text in italics
• <OL></OL>     For creating ordered lists
• <A></A>       For creating links
• <FORM></FORM> For creating fill-in forms
• <P>           For creating a new paragraph
• <BR>          For creating a line break
• <INPUT>       For creating form elements
       HTML Tags (continued)
The affected text is contained within the tags
• <B>Hello</B> ------- Hello
• <I>Bye!</I> ---------- Bye
• Ordered list
                                    1. Apple
                                    2. Banana
      <LI>Orange</LI>               3. Orange
               HTML Form
• <FORM> and </FORM> mark the beginning and
  the end of a form

• Form establishes the relationship between the
  form page and the script that will process the
  current form data

• HTML forms are the user interface that provides
  input to your CGI scripts
      - Collecting data
      - Accepting commands
      HTML Form (continued)
<TITLE>My first html page</TITLE></HEAD>
<FORM method=post action=―aftersubmit.cgi‖>
Name: <INPUT type=text name=―uname"><BR>
Password: <INPUT type=password
<INPUT type=submit>
<INPUT type=reset>
           The <FORM> Tag
• <FORM method=post action=―aftersubmit.cgi‖>
   Tag attributes specify the properties for the
• method
  determines how the form data is sent to the script
      - GET-- delivers form data by appending it to
                  the URL of the script
      - POST-- sends the data as a body of text
• action
  specifies the address of the script that is going to
  process the current form data
         The <INPUT> Tags
  - is an element of the form
  - creates a wide variety of interface widgets
• <INPUT type=text name=―uname">
• Attribute ―type‖— the appearance and features
       <INPUT type=text>-------text field
       <INPUT type=submit>-----submit button
       <INPUT type=reset>------reset button
       <INPUT type=password>---password field
       <INPUT type=hidden>-----hidden field
 The <INPUT> Tag (continued)
• INPUT attribute "name"
  identifies each user interface element
      <input type=text name=―uname">
      <input type=password name=―upwd">
• INPUT attribute "value"
  contains associated information that is also sent
  to the script.
      <input type=text name=―uname">
      <input type=text name=―uadd">
      <input type=text name=―ucity―
           Form Submission
<FORM method=post action = ―aftersubmit.cgi‖>

• The browser assembles the form data (name
  and password) into a series of name/value pairs
• The browser delivers data to the server and then
  the script
• The script ―aftersubmit.cgi‖ can retrieve the
  element value by using its name (uname and
                   CGI Script
• Is still a Perl script

• Generates a web page

• Needs a content header
    print "Content-type: text/html";
    print "Content-type: image/gif";
                  CGI Script
print "Content-type:text/html\n\n";

print "<html><head>‖;
print ―<title>Test Page</title></head>\n";
print "<body>\n";
print "<b>Hello, world!</b>\n";
print "</body></html>\n";
          How does it work?
• CGI script output:
     <title>Test Page</title></head>
     <body><b>Hello, world!</b>
• The output is sent to the server.
• The server captures the output + HTTP headers,
  and sends them back to the browser.
• The browser receives the information, formats
  and displays the text appropriately.

print "Content-type: text/html\n\n";

print "<html><body>";
print "<form method=post action=\―show_param.cgi \">";
print "Name <input type=text name=\"name\"><br>";
print "Address <input type=text name=\"add\"><br>";
print "City <input type=text name=\"city\"><br>";
print "<input type=submit><br>";
print "<input type=hidden name=\‖hidden\‖
print "</form>";
print "</body></html>";
            show_param.cgi (1)
print "Content-type: text/html\n\n";
                  the module is used
use CGI;
                     a object $q is created
$q=new CGI;

# retrieve the parameter values
$add=$q->param("add");          Parameter names
                Explanation (1)
• module
  - is the standard tool for creating CGI scripts in Perl
  - offers many methods: For example:
       - Handling Input (form parameters, environment info)
       - Generating Output (HTML document)
       - Handling Errors (CGI::Carp)
• New CGI object
• param: is a very useful method. It allows you to
  access the parameters submitted to your CGI script
         show_param.cgi (2)
# get the environment information
                         environment variables

         show_param.cgi (3)
print "<HTML><BODY>";
print "Name: $name<BR>";
print "Address: $add<BR>";
print "City: $city<BR>";
print "Hidden: $hidden<BR>";
print "<HR><BR>";
print "Server Software: $server<BR><BR>";
print "HTTP REFERER: $ref<BR><BR>";
print "Content Length: $len<BR><BR>";
print "Remote Address: $Remote_Add<BR><BR>";
print "Server Protocol: $protocol<BR><BR>";
print "Server Name: $Server_Name<BR><BR>";
print "Request Method: $method<BR><BR>";
print "<\/BODY><\/HTML>";
          Reading Data File

• When you build large web application, you
  will need to store data and retrieve it later

• Text files are the simplest way to maintain
      Reading Data File (script)
print "Content-type: text/html\n\n";

If (open (FILE, $filename) )
    @filecontent=<FILE>;     file handle
    close FILE;
    print "<html><body>";
    print ―Data is saved.‖;
    print "</body></html>";
                 File Handle
• The file handles are just the things we use when
  we are dealing with files.
• A file handle is associated with a file by the open
       open (FILE, $filename)
• All the interaction with a file is done by the file
       @filecontent = <FILE> -- get the whole file
       $filecontent = <FILE> ---- get the first line
                  Writing Data File
use CGI;
$q=new CGI;
print "Content-type: text/html\n\n";

if (open (OUTPUT, ">>$outputfile"))  # open a file
    print OUTPUT "$name\n";         # write the user name to the file
    print "<HTML><BODY>Thank you! $name</BODY></HTML>";
   print "<HTML><BODY>Error<\/BODY><\/HTML>";
    Writing Data File (continued)
• Opening a file for writing
    - For overwriting
             open (OUTPUT, ">>$outputfile")
   - For appending
             open (OUTPUT, ">$outputfile")
• Without ―>>‖ and ―>‖, the file is opened for reading
             open (OUTPUT, "$outputfile")
• Creating the output file and making it writable
      touch users.txt
      chmod a+w users.txt
  Writing and Running a CGI script
• Writing the script using a plain text editor

• Saving the file ―myCGI.cgi‖ in:

• Opening a terminal, and type:
      cd public_html/cgi-bin --- change the directory
      chmod 755 myCGI.cgi --- make the script executable

• Opening the browser, and running the script:
• Default response of the server:
   "Internal Server Error" --- not useful

• Better ways:
  In the script
      use CGI::Carp qw(fatalsToBrowser);
  In the UNIX shell (check the syntax)
      perl -cw scriptname.cgi
      Debugging (continued)
• use CGI::Carp qw(fatalsToBrowser);
         Debugging (continued)

• perl -cw scriptname.cgi

  syntax error at myCGI.cgi line 23 and line 29, near "print―
  myCGI.cgi had compilation errors.
• Basic HTML (structure, tags, forms)
• Basic Perl (variables)
• Basic CGI
  - form processing (retrieving form data)
  - writing data file
  - reading data file
• Steps for working with CGI scripts
  - writing and saving the file to ―public_html/cgi-bin‖
  - changing the file permission to executable
  - running the script
• Debugging

•   Dr. David Wishart
•   Shan Sundararaj
•   Hassan Monzavi
•   Haiyan Zhang

To top