CSCI A348/548
Lab Notes Eight

Fall 2000


Midterm review

Please be sure to review lecture notes 15 before starting the experiments.


Experiment One.

Place this script in your cgi-bin:

#!/usr/bin/perl

if ($ENV{REQUEST_METHOD} eq 'GET') {
  $in = $ENV{QUERY_STRING}; 
} else { 
  read(STDIN, $in, $ENV{CONTENT_LENGTH}); 
} 

print "Content-type: text/html\n\n($in)\n"; 
Part A:

Connect to your server using telnet from tucotuco this way:

tucotuco.cs.indiana.edu% telnet burrowww 10000
Trying 129.79.245.98...
Connected to burrowww.cs.indiana.edu.
Escape character is '^]'.
GET /cgi-bin/eOne HTTP/1.0

HTTP/1.1 200 OK
Date: Sat, 14 Oct 2000 18:40:42 GMT
Server: Apache/1.3.1 (Unix)
Connection: close
Content-Type: text/html

()
Connection closed by foreign host.
tucotuco.cs.indiana.edu% telnet burrowww 10000
Trying 129.79.245.98...
Connected to burrowww.cs.indiana.edu.
Escape character is '^]'.
GET /cgi-bin/eOne?hello HTTP/1.0

HTTP/1.1 200 OK
Date: Sat, 14 Oct 2000 18:40:59 GMT
Server: Apache/1.3.1 (Unix)
Connection: close
Content-Type: text/html

(hello)
Connection closed by foreign host.
tucotuco.cs.indiana.edu% 
Explain the process and the result.

Part B:

Now connect again but do it this way:

tucotuco.cs.indiana.edu% telnet burrowww 10000
Trying 129.79.245.98...
Connected to burrowww.cs.indiana.edu.
Escape character is '^]'.
POST /cgi-bin/eOne HTTP/1.0

HTTP/1.1 200 OK
Date: Sat, 14 Oct 2000 18:48:18 GMT
Server: Apache/1.3.1 (Unix)
Connection: close
Content-Type: text/html

() 
Connection closed by foreign host.
tucotuco.cs.indiana.edu% telnet burrowww 10000
Trying 129.79.245.98...
Connected to burrowww.cs.indiana.edu.
Escape character is '^]'.
POST /cgi-bin/eOne HTTP/1.0
Content-length: 5

heLLo
HTTP/1.1 200 OK
Date: Sat, 14 Oct 2000 18:48:40 GMT
Server: Apache/1.3.1 (Unix)
Connection: close
Content-Type: text/html

(heLLo)
Connection closed by foreign host.
tucotuco.cs.indiana.edu% telnet burrowww 10000
Trying 129.79.245.98...
Connected to burrowww.cs.indiana.edu.
Escape character is '^]'.
POST /cgi-bin/eOne HTTP/1.0
Content-length: 5

abcdefghij
HTTP/1.1 200 OK
Date: Sat, 14 Oct 2000 18:49:34 GMT
Server: Apache/1.3.1 (Unix)
Connection: close
Content-Type: text/html

(abcde)
Connection closed by foreign host.
tucotuco.cs.indiana.edu% 

Explain the process and the result, compare with Part A.

Experiment Two.

Add eTwo to your cgi-bin:

#!/usr/bin/perl

if ($ENV{REQUEST_METHOD} eq 'GET') {
  $in = $ENV{QUERY_STRING}; 
} else { 
  read(STDIN, $in, $ENV{CONTENT_LENGTH}); 
} 

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

@in = split(/&/, $in); 

foreach $e (@in) {
    print $e, "\n"; 
} 
Part A:

Connect from tucotuco this way:

frilled.cs.indiana.edu% telnet burrowww 10000
Trying 129.79.245.98...
Connected to burrowww.cs.indiana.edu.
Escape character is '^]'.
GET /cgi-bin/eTwo?a=b&c=d
a=b
c=d
Connection closed by foreign host.
frilled.cs.indiana.edu% telnet burrowww 10000
Trying 129.79.245.98...
Connected to burrowww.cs.indiana.edu.
Escape character is '^]'.
POST /cgi-bin/eTwo HTTP/1.0
Content-length: 7

a=b&c=d
HTTP/1.1 200 OK
Date: Sat, 14 Oct 2000 19:39:45 GMT
Server: Apache/1.3.1 (Unix)
Connection: close
Content-Type: text/html

a=b
c=d
Connection closed by foreign host.
frilled.cs.indiana.edu% 

Explain the process and the result.

Part B:

Create the following file, and add it as eTwo.html in your htdocs.

<html>
<body bgcolor=white>
<form method=POST action="/cgi-bin/eTwo">
<input type=text name=userInput> <p>
<input type=submit>
</form>
</body>
</html>

Then enter

a=b&c=d
in the text field and press Submit.

Explain the process and the result, and the relationship with Part A (if any).

What changes (if anything) if we replace POST by GET in the method attribute of the <form> tag.


Experiment Three

Part A:

Add eThree.html (below) to your htdocs.

<html>
  <body bgcolor=white>
    <form method="POST" action="/cgi-bin/eTwo">
      <input type=text name="a"> 
      <input type=text name="c"> 
      <input type="submit" value="Proceed">
    </form>
  </body>
</html>
Bring it up in your browser, type b in the first field, and d in the second.

Then push the submit button.

Explain the process and the result. What relationship does this experiment have with any of the previous experiments?

Part B:

Now add eThree to your cgi-bin:

#!/usr/bin/perl

if ($ENV{REQUEST_METHOD} eq 'GET') {
  $in = $ENV{QUERY_STRING};
} else {
  read(STDIN, $in, $ENV{CONTENT_LENGTH});
}

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

@in = split(/&/, $in);

foreach $e (@in) {
  ($name, $value) = split(/=/, $e);
  $name  =~ s/%(..)/chr(hex($1))/ge;
  $value =~ s/%(..)/chr(hex($1))/ge;
  print $name, "=(", $value, ")";
}

Call it with

http://burrowww.cs.indiana.edu:100xx/cgi-bin/eThree?userInput=a%3Db%26c%3Dd
Try to anticipate the result (remember Part B from the previous experiment) and explain it.


Experiment Four (JavaScript Objects)

For these experiments you can work on the desktop, with Notepad and Netscape.

Part A:

Create alpha.html and load it in Netscape:

<html><body bgcolor=white><script>
function hash () {
  this.length = 0; 
  return this; 
} 
var a = new hash(); 
a["0"] = 1; a["length"] += 1; 
a["1"] = 2; a["length"] += 1; 
a["2"] = 3; a["length"] += 1; 
a["3"] = 4; a["length"] += 1; 
for (i in a) {
  document.writeln(i + " = " + a[i] + "<p>"); 
} 
</script></body></html>
Explain the process and the result that you obtain when you load this code in the browser.

Part B:

Create beta.html as below:

<html><body bgcolor=white><script>
function add (value) {
  this[this.length] = value; 
  this.length += 1; 
} 
function hash () {
  this.length = 0; 
  this.add = add; 
  return this; 
} 
var a = new hash(); 
a.add(1); 
a.add(2);
a.add(3);
a.add(4); 
for (var i = 0; i < a.length; i++) { 
  document.writeln(i + " = " + a[i] + "<p>"); 
} 
</script></body></html>

Discuss similarities and differences between the two programs.

How could you best describe this:

function add (value) {
  this[this.length] = value; 
  this.length += 1; 
} 
function show() {
  for (var i = 0; i < a.length; i++) { 
    document.writeln(i + " = " + a[i] + "<p>"); 
  }
} 
function hash () {
  this.length = 0; 
  this.add = add; 
  this.show = show; 
  return this; 
} 


Last updated on October 14, 2000, by Adrian German for A348/A548