Jumpstart into the Web technologies: <- Prev. Start Contents References Home Next ->
CGI - Common Gateway Interface

The Common Gateway Interface (CGI) is a standard for interfacing external applications with information servers, such as HTTP or Web servers. A plain HTML document that the Web daemon retrieves is static, which means it exists in a constant state: a text file that doesn't change. A CGI program, on the other hand, is executed in real-time, so that it can output dynamic information.

Simple diagram of how CGI is working:

Basically it's very simple:

  1. User enters the input on his Web browser into the form (<FORM> tag)
  2. Browser packs the input according to the CGI specifications and sends it to the URL, which is specified in ACTION field of the FORM. It's actually sent to the HTTP server.
  3. Server extracts the program name from the URL and calls the program, passing the packed user input to the program as well.
  4. Server takes the output (standard output) of the program and passes it back to the browser.

So basically in our CGI program we need to know how to do two things: first, take the user's input & unpack, so we can use it and, second, figure out what to print to stdout, so broswer will understand.

Getting the user's input
There are two methods (METHOD parameter of the FORM tag) of passing parameters to CGI program:

Note, that if METHOD is not specified, the default is GET.
In most of the cases POST method should be used, because it't more flexible and also, there is a high probability, that while using GET method, long input will be truncated.
GET method is useful if you want to create a URL link to some CGI program and pass some parameters (you just append them to the URL with '?' character). Just don't forget to encode all the special characters (space is encoded with '+'), but most of the CGI libraries have functions to do the encoding for you.
In both cases, the content of the form will be encoded in the following form: name=value&name=value&name=value
Most likely, you won't have to deal with encoding & decoding, because it's a good idea to use some CGI library. In case of Perl it would be CGI.pm, which comes with standard perl distribution.

Producing the output and sending it back to the client
The output of CGI program consists of two parts: header & body. The delimiter between the header and body is an empty string.
The body is usually a simple HTML page, created by the program. It can also be any other type of thing, like image or binary document, but in most cases it'll be HTML.

Here is the list of valid HTTP headers:

The minimal thing you'll need to do in your CGI program is to produce Content-type header.e.g.: 

#!/usr/local/bin/perl
print "Content-type: text/html\n\n";
print "<HTML>\n";
print "<HEAD><TITLE>Hello world!</TITLE></HEAD>\n";
print "<BODY><H1>Hello world!</H1></BODY>\n";
print "</HTML>\n";

Keeping the state (session) between the CGI calls
Since it's typical client-server model, to produce each screen, a new process should be started on the server. Which means, that there is no way for this process to know what happened in the previous one.
There are some techniques, that allow you to keep some info between the sessions:

The List of environment variables, used by CGI:

Possible Form tags (quick reference):
Form Tag Look Description
<FORM ACTION="/cgi-bin/prog.cgi" METHOD="POST">
 
 Begin of the form
<INPUT TYPE="text" NAME="name" VALUE="value" SIZE="size"> Text field
<INPUT TYPE="password" NAME="name" VALUE="value" SIZE="size"> Password field
<INPUT TYPE="hidden" NAME="name" VALUE="value">   Hidden field
<INPUT TYPE="checkbox" NAME="name" VALUE="value1"> Checkbox
<INPUT TYPE="radio" NAME="name" VALUE="value1">
<INPUT TYPE="radio" NAME="name" VALUE="value2">		 Radio button
<SELECT NAME="name" SIZE=1>
<OPTION VALUE="1" SELECTED>Choice1
<OPTION VALUE="2">Choice2
</SELECT>		 Menu
<SELECT NAME="name" SIZE=n MULTIPLE>
<OPTION SELECTED>Choice1
<OPTION>Choice2
</SELECT>		 Scrolled list
<TEXTAREA ROWS=yy COLS=xx NAME="name"> some text . </TEXTAREA> Multiline text fields
<INPUT TYPE="submit" VALUE="Message">
<INPUT TYPE="submit" NAME="name" VALUE="value">
<INPUT TYPE="image" SRC="images/submit.gif" NAME="name" VALUE="value">

Submit buttons
<INPUT TYPE="reset" VALUE="Message"> Reset button
</FORM>   Ends form

Note: All values should be in double quotes! Now it's working without it, but next year it will not! XML doesn't allow it, it's much more strict.

Summary:
Now we can receive user's input and do something with it. There are some pluses and some minuses with CGI:

More info on CGI can be found here.

Jumpstart into the Web technologies: <- Prev. Start Contents References Home Next ->

Copyright © 2000 Sergey Gribov