View
217
Download
0
Category
Tags:
Preview:
Citation preview
World Wide Web ComponentsWorld Wide Web Components
Browsers and Servers
CGI Processing Model
(Common Gateway Interface)
© Norman White, 2001
WWW is example of WWW is example of Client/Server ComputingClient/Server Computing
Server computers are located all around the world and respond to requests (messages) from Computers running browser software (Netscape, IE)
Browser applications understand HTML, (and now Javascript, Java etc.)
Server Browser Interaction Server Browser Interaction (simple)(simple)
BB ServerServer
http requesthttp request
Browser send http request to serverBrowser send http request to server(I.e. GET index1.html)(I.e. GET index1.html)
Index1.html fileIndex1.html file<html><html>
<head><head>
<title> Sample Title</title><title> Sample Title</title>
</head></head>
<body><body>
Here is some text and a picture <img Here is some text and a picture <img src=“pic1.gif:>src=“pic1.gif:>
</body></body>
</html></html>
Server ResponseServer Response
BB ServerServer
http requesthttp request
HTML fileHTML file
Server retrieves fileServer retrieves fileSends file (index1.html) to BrowserSends file (index1.html) to Browser
BB ServerServer
http requesthttp request
HTMLHTML
index.htmlindex.html
Browser “formats” index1.htmlBrowser “formats” index1.htmlMay mean retrieving more filesMay mean retrieving more filesIn order to displayIn order to display
Browser Displays fileBrowser Displays file
Browser asks for next fileBrowser asks for next file
BB ServerServer
http requesthttp request
HTMLHTML
index1.htmlindex1.htmlGET pic1.gifGET pic1.gif
index.html contains reference to index.html contains reference to pic1.gifpic1.gifBrowser then requests pic1.gifBrowser then requests pic1.gif
Server sends pic1.gifServer sends pic1.gif
BB ServerServer
http requesthttp request
Index1.htmlIndex1.htmlGET pic1.gifGET pic1.gif
index1.htmlindex1.html
pic1.gifpic1.gif
Server next sends pic1.gifServer next sends pic1.gif
BB ServerServer
http requesthttp request
index1.htmlindex1.html
GET pic1.gifGET pic1.gif
index1.htmlindex1.html
pic1.gifpic1.gif
pic1.gifpic1.gif
Browser displays pic1.gifBrowser displays pic1.gif
Browser displays pic1.gifBrowser displays pic1.gif
RESULT ???RESULT ???
Processing Non-HTML filesProcessing Non-HTML filesServer sends a header in front of each file
identifying the file type (HTML,GIF,JPEG etc.)
Most Browsers understand HTML, GIF and TEXT
Browsers can be configured to call external programs to handle new types of files
Helper AppsHelper Apps These programs are called HELPER applications
and dramatically extend the capabilities of the browser, since they can be developed independently of the client software
Examples - Quicktime viewers, sound players, VRML viewers etc.
To see the currently configured viewers go to options on the Netscape title bar
PluginsPlugins
Browser functionality can also be extended by adding plugins.
Plugins are not standalone applications, but executable code that is dynamically linked into the browser when necessary.
Forms and CGI ProgrammingForms and CGI Programming HTML provides an easy to use FORM capability,
which allows a wide variety of input forms to be easily generated.
Form data types include – Text input - One line of text– Textarea - Multiple lines of text– Check boxes (on/off)– Radio boxes (1 of N)– Etc.
Forms Processing LogicForms Processing LogicOutput of Form is formatted and sent to
Server, along with the name of a program to process the contents of the form.
The WEB Server takes information from form, and passes it on as input to a Common Gateway Interface Program (CGI)
Output of CGI program is sent back to Client browser as an HTML (or other) file.
CGI programming extends CGI programming extends power of WWWpower of WWW
CGI programs can do an almost unlimited set of activities ...– Look up info in a database and send it to
Browser.– Take input from user and add to a file.– Take input and send to a standard business
application– CGI program can be in any language that runs
on the server
CGI ProgrammingCGI Programming
BB
httphttpserverserver
CGI ProgramCGI Program
http form content http form content
inputinput outputoutputHTMLHTML
(Note, all processing is on server)(Note, all processing is on server)
What do you need to do for What do you need to do for CGI?CGI?
Develop form to collect information from users
Write and test CGI program to handle form information
Put the URL of the CGI program in the “ACTION” statement of the form.
CGICGITwo Processing optionsTwo Processing options
Two Types of FORM processing options, GET and POST– GET - parameters sent additions to URL string.
Each individual parameter separated by &– POST - Data sent in message body. This is a
more general method and can handle more input data.
CGI Processing - reviewCGI Processing - review
Server sends form (in html document) to client Client displays form, and user fills in fields Client sends form info to server (SUBMIT button) Server runs the CGI program named in the
ACTION section of the FORM.. CGI program parses data as input Output of CGI program is sent by the server to the
client (i.e. it should be HTML)
CGI Advantages and DisadvantagesCGI Advantages and Disadvantages
Advantages– Very general model, easy to do really neat
things like front end existing applications, databases etc.
– Many toolkits available to do common things
Disadvantages– All processing is done on server. May overload
server
ScalabilityScalability
At first, CGI model seems limited by server capacity, but with a few tricks we can change that.
Note that the “ACTION” statement points to a URL. Since the URL can also include the server name, we can have “application” servers for specialized applications, so all the processing is not done on the web server.
Writing a CGI ProgramWriting a CGI Program
CGI program needs to – Parse form input– Process the input– Generate html output
I.e the program has to dynamically generate the Appropriate HTML statements
GET vs. POSTGET vs. POSTAlternative CGI methods Alternative CGI methods
GET format– Information is passed as a series of variable=value pairs
separated by “&” to program named in action statement by adding them on to the URL (after a “?”)
– Simple example – one line form with a field named “userid” and “ACTION=mycgiprog.cgi”
– User enters “nwhite”– Browser sends the following to the web server
http://www.stern.nyu.edu/~nwhite/mycgiprog.cgi?userid=nwhite
GET ProcessingGET ProcessingServer SideServer Side
Web server takes the information after the “?” and creates an environment variable named “QUERY_STRING”, then executes the program “mycgiprog.cgi”
QUERY_STRING contains– userid=nwhite
CGI program retrieves value of QUERY_STRING, does appropriate processing, and (optionally) sends an HTML response back
GET method – more than one GET method – more than one parameterparameter
What if we want have more than one field?No problem QUERY_STRING can contain
many variable=value pairs separated by “&” i.e. userid=nwhite&password=junk&fname=Norman Possible problem, how big can environment
variables be (how many characters) GET only useful for limited input
POST MethodPOST Method
POST method more general Input is passed as a series of input lines (stdin) Variable1=value1 Variable2=value2 ….
Environment variable CONTENT_LENGTH is set to the number of characters of input.
Input processing logic needs to be different for GET and POST methods
CGI OutputCGI Output
CGI output is passed back to the browser, hence has to be something (HTML) the browser can understand Like…
Content-type: text/html
<HTML><HEAD> <TITLE>output of HTML from CGI script</TITLE> </HEAD><BODY> <H1>Sample output</H1> What do you think of <STRONG>this?</STRONG> </BODY></HTML>
Simple Example – GET Simple Example – GET MethodMethod
List the contents of your “websys” directory Create a Shell Script named lister.cgi which contains #! /bin/sh echo content-type: text/html echo <html><head><title>Listing</title> echo </head><body><p> pwd ls –alt echo </body><html>
Try it, what happens?Try it, what happens?
To run it, put it in your websys directory chmod +rx lister.cgi
Type the following as a URL
http://www.stern.nyu.edu/~userid/websys/lister.cgi
CGI Example – POST MethodCGI Example – POST Method
Adds links to a file of students in a classPassword ProtectedSteps
– Parse data (POST form)– Check Password– Add info (in html format) to end of roster
#include <stdio.h>
#ifndef NO_STDLIB_H
#include <stdlib.h>
#else
char *getenv();
#endif
#define MAX_ENTRIES 10000
typedef struct {
char *name;
char *val;
} entry;
char *makeword(char *line, char stop);
char *fmakeword(FILE *f, char stop, int *len);
char x2c(char *what);
void unescape_url(char *url);
void plustospace(char *str);
void unescape_url(char *url);void plustospace(char *str);
main(int argc, char *argv[]) { entry entries[MAX_ENTRIES]; register int x,m=0; int cl; int PASS; FILE *fp;
printf("Content-type: text/html%c%c",10,10);
if(strcmp(getenv("REQUEST_METHOD"),"POST")) {
printf("This script should be referenced with a METHOD of POST.\n");
printf("If you don't understand this, see this ");
printf("<A HREF=\"http://www.ncsa.uiuc.edu/SDG/Software/Mosaic/Docs/fil\
l-out-forms/overview.html\">forms overview</A>.%c",10);
exit(1);
}
if(strcmp(getenv("CONTENT_TYPE"),"application/x-www-form-urlencoded")) {
printf("This script can only be used to decode form results. \n");
if(strcmp(getenv("CONTENT_TYPE"),"application/x-www-form-urlencoded")) { printf("This script can only be used to decode form results. \n"); exit(1); } cl = atoi(getenv("CONTENT_LENGTH")); PASS = 0; for(x=0;cl && (!feof(stdin));x++) { m=x; entries[x].val = fmakeword(stdin,'&',&cl); plustospace(entries[x].val); unescape_url(entries[x].val); entries[x].name = makeword(entries[x].val,'='); /* Check here for passwd field = Z */ if (*entries[x].name=='p') {
if (strcmp(entries[x].val,"MDSS")== 0) PASS = 1;}
}
if (PASS == 1)
{if ((fp = fopen("/class/nwhite/b3146/roster.html","a"))
== NULL) {PASS=3;
printf("<h1> unable to open output file, tell Professor White</h1>");
} else {
fprintf(fp,"<A href=\"http://www.stern.nyu.edu/~%s\" > Home Page for %s \n \</a>", entries[0].val,entries[2].val); fprintf(fp,"<p><h3>Why you might want to visit the homepage for %s ... </h3\>\n <p>", entries[2].val);
fprintf(fp,"%s <p>",entries[3].val);
fprintf(fp,"<p><hr><hr><p>");
printf(" Link successfully added \n");
printf("<a href=\"http://www.stern.nyu.edu/~nwhite/class/b3146/roster.html\
\">
<b>Click here to see the updated roster</b> </a>");
}}
if (PASS != 1) {
printf("<H1> INVALID PASSWORD, See Professor White </H1>");
}
}
ConclusionConclusionWorld-Wide-Web model is much more
powerful than it appears on the surfaceEasily integrated with existing applicationsEasy to add new functionalityCGI model can do lots of things…
– Update files– Link to corporate databases– Specialized Applications
CaveatsCaveats
Problems– Overhead
Need to start up a new program for every request
– Scalability All processing on server, what happens as usage
grows?
– Reliability How do we replicate for redundancy?
Recommended