Mike Gossland's Perl Tutorial Course for Windows


Intro to CGI | First Page | Printing HTML | Serving HTML | Serving Edited


Chapter 5. Introduction to CGI

Serving Edited Files

Now that you know how to fetch and serve an existing HTML file, you can use it as the basis for editing. Try saving this web page as "editing.html" in your cgi-bin directory and running this perl script:

print "Content-Type: text/html\n\n";
open HTML, "editing.html" or die $!;
while( <HTML> ) {
  s{<title>.*?</title>}{<title>Sub'n'Serve Demo</title>};
  s{<h2.*?</h2>}{<h2>Substituted Header!</h2>}i;
  print;
}
close HTML;

You will see that the output page now has a new title, and different headers.

You can extend this concept in many ways. Consider these few ideas and see if you can think of more:

  • substitute other new words for old in the text as above
  • put special words in the text, like _name_, especially for "form letter" substitution
  • add hyperlinks to a document. See below
  • highlight keywords. See below
  • put <!-- replace me --> comments in places your Perl script should fill in. These remain invisible if not replaced.
  • put <!-- section start --> and <!-- section stop --> comments for invisible markers around whole sections of code that should be replaced.

As an example of adding hyperlinks and highlighting words on the fly to existing content, have a look at this next script. It's something that could be done on the fly, as you are about to see, or it could be done as an offline editing process.

This script might be a bit challenging so here are some words of explanation. Don't get thrown by the <DATA> filehandle. It's a filehandle that's opened for you by Perl if you use it. It's a nifty way of attaching data at the bottom of your program under the line __DATA__ (that's DATA with two underscores both before and after). We are using the data under __DATA__ to define the words we want to substitute along with the URL they should point at.

First, we read the "word, URL" pairs in from the end of the script through the DATA filehandle. We loop through them to build up the  hash, %hyperlinks, of words and associated URL's.

As an example of printing diagnostics during development, we print the key and value pairs of the hash at the top of the browser window, right after the Content-Type is written. We could print much more comprehensive diagnostic info with more print statements throughout the program. We'd remove the diagnostics after we were happy with the way the script worked.

Once we have our hyperlink hash done, we just loop through each HTML line with the while(<HTML>) loop. Then for each HTML line, we loop through the words that need substitution. The substitution looks for the selected substitution word and replaces it with a hyperlink reference to the URL, with some highlighting.

We put spaces (\s) around the subsitution pattern to only catch whole words, and not their occurrences inside other words.

Once you've run the script have a look at the source to see what happened to the substituted words.

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

for ( <DATA> ) {
  #skip blank lines
  next if /^$/;
  ($key, $value) = split /\s*,\s*/;
  $hyperlink{$key} = $value;
  #Once you've printed the header,
  #you can print diagnostics to the browser window!
  print "$key, $value<br>\n";
}

open HTML, "editing.html" or die $!;

while( <HTML> ) {
  for $key ( keys %hyperlink ) {
    s(\s$key\s)
    ( <a href="$hyperlink{$key}" style="background:silver">$key</a> );
  }
 print;
}

close HTML;

__DATA__
special, http://www.m-w.com
code, javascript:alert('Code!')
example, course/index.html

This is just the beginning of substituting on the fly. It is a very powerful and useful technique. Sometimes the same kind of editing should be done offline instead of online.

The next chapter will deal with responding to input from the user.