Tutorial: Server-side Scripting with Perl
Fasten your seatbelt! In this lesson you learn how to write a perl script on the Web server to handle the data received by an HTML form.
1. CGI and Perl
The Common Gateway Interface, more commonly referred to as CGI, is a technology used to run programs or scripts stored on the Web server, from an HTML document. Typically CGI is used to pass user input gathered in HTML forms to programs which then send HTML output back to the Web browser. Click here for illustration.
The most common programming language used with CGI is Perl. Perl is a robust programming language perfectly suited to manipulating form data. Perl programs can access and write data to files and databases, send email, run calculations, and do anything else that software can do. When a Perl program file is used with CGI it adopts a .cgi filename extension, otherwise it uses a .pl file extension.
It would take months to really learn how to program using Perl. This tutorial and assignment will provide only an introduction to the language. To really learn Perl, buy O'Reilly's "Learning Perl" and/or Google "Perl Tutorial" to find free tutorials. One good online tutorial can be found at http://www.cgi101.com/book/
2. Learning from example
The example we will use for this exercise is located at http://garnet.acns.fsu.edu/~kbaldauf/cgi-bin/. There you will find three files:
- guestbook.cgi - the Perl program that manipulates the data sent from the guestbook HTML form
- guestbook.html - the guestbook HTML form
- guestbook_data.csv - data submitted by guests using the guestbook form
- View the source for guestbook.html
- Fill out and submit the form at guestbook.html
- Open guestbook_data.csv to see the data collected
- View the code in guestbook.cgi
- All Perl programs start by showing where the Perl interpreter is stored on the server: #!/usr/local/bin/perl
- Comments are indicated with the pound character(#). The interpreter ignores anything beyond the # to the end of the line. Comments provided in guestbook.cgi are used to instruct the student.
- Read comments for all lines of code to understand their purpose.
- Notice all commands must end in a semicolon
- Double quotes or single quotes can be used to indicate a text string. Double quotes provide interpreting of the text string which allows you to include variables and special characters in your text string.
- Variable names are preceded by a dollar sign.
- The param() function is used to get form data and assign it to a local variable for example
$lname = param('lname');
gets the data from the form object named lname and assigns it to the program variable $lname
- NOTE THAT THE NAME USED IN THE PARAM FUNCTION MUST EXACTLY MATCH THE NAME GIVEN TO FORM OBJECT IN THE FORM. In the above example lname is used in the form as follows:
<input name="lname" type="text" size="30" />
3. Setting up your cgi-bin folder on garnet
Use SSH Secure Shell to create a new directory in your public_html directory on garnet named cgi-bin (note this directory goes in public_html not in your CGS3066 directory - http://garnet.acns.fsu.edu/~username/cgi-bin
Change the permissions on your new cgi-bin directory to 755
4. Uploading files to your cgi-bin folder and setting permissions
Time to test out CGI from your own cgi-bin directory. Download (save to your computer) the guestbook.html and guestbook.cgi files from http://garnet.acns.fsu.edu/~kbaldauf/cgi-bin/. Use SSH file transfer to upload those two files to your own cgi-bin directory.
Change the permissions on both files to 755.
5. Editing files on garnet with Pico
Use the SSH Secure Shell Client to access the garnet command line: connect and login to garnet.acns.fsu.edu login, and when you see the menu type 12 and press Enter.
Might as well put your mouse out of reach as it is no use from the command line and will only get you into trouble.
type bash and press Enter to switch to a more convenient command line shell
type cd public_html/cgi-bin and press Enter to change to your cgi-bin directory.
type pwd and press Enter to confirm that you are in the correct location
type ls and press Enter to view the contents of the directory
type ls -al to view the contents in more detail
type pico guestbook.html and press enter to open the guestbook.html file for editing in the Pico editing program
Pico allows you to edit your code on the server. It is a very basic editor with only a handful of commands. Your mouse will not work in Pico. You will need to use the arrow keys to move around. The commands you can use are listed at the bottom of the window. For example ^X (Ctrl-X) exits Pico and returns you to the command line, ^O (Ctrl-O) Outputs (saves) your file without exiting, ^V is equivalent to Page Down, and ^Y Page Up. ^K Cuts an entire line of text, and ^U Pastes it.
Leave your file open in Pico for the next step.
6. Setting the form tag to access your script through FSU's CGI wrapper program
FSU uses a special system, called a wrapper, to guard against CGI programs that run amuck. You can read about it at http://www.ucs.fsu.edu/www/cgi.html if you are interested. We need to edit your guestbook.html file to use the CGI wrapper.
Use Pico to go down to line 30 of guestbook.html (^C shows you what line you are on) and change kbaldauf to your own username
Change any other references to ken baldauf to your own name (^W can help find instances of baldauf).
Exit Pico (^X), type y when asked "save modified buffer?", and press Enter to accept the same file name.
At the command line type pico guestbook.cgi (the Perl program file) and press Enter to run the Pico editing program
Change the email address on line 15 to your own email address - then exit Pico and save your change.
7. Testing out your cgi application
Try out your guestbook form and program by going to http://garnet.acns.fsu.edu/~your_username/cgi-bin and opening the html file. If you did everything correctly, it should run fine. You'll notice that when the form is submitted it creates a third file in your cgi-bin directory that holds the data. It should also send you a notification email.
8. Work on part 2 of the assignment