Lab 4: HTTP and Forms Processing
In this lab you will learn about the HTTP protocol including request and response headers, response codes, and methods. You'll get a close-up view of forms processing using GET and POST methods. You'll view HTTP logfiles and identify the elements. You'll better understand cookies. And, while you're at it, you'll get a little practice with Chrome developer tools.
The task for this lab is to answer a series of questions. You can do that by filling out and turning in the sheet of questions I hand out in the lab or on a separate sheet of paper.
- What are the name and ID of the element that has the menu bar on the left side (or across the top, if the page is narrow)?
- Find the td for Wednesday of week 1. Add "hol" to its classes. What happens to its appearance?
- Find table#schedule in the list of styles on the right. For the table#schedule .sep selector, change the background color to #FFFF00. What happens to the appearance of the table? Is it an improvement?
- How many total documents were downloaded (total hits)? How many scripts? Images? Stylesheets? Documents? What other types were there? How much total data?
- What are the different response codes you see and what do they mean?
- How long did the page take to load? What do you think accounted for the delays?
- Sometimes one file causes another file to be loaded, which causes another file to be loaded. What's the longest chain you can find?
- What is the first line of the request headers?
- What host name was the request sent to?
- Were any cookies sent back to the server? What were their names?
- What version of what web server is running on cs.calvin.edu?
- What was the value of the Content-Type response header?
- Write the first three lines that the browser sent to the server, followed by the first three lines that the server sent back to the browser, here:
- Name some approaches that could be tried to speed pageload times.
- What happens to the Web page? To the URL of the Web page?
- What happens when you change the value of the name variable in the URL?
- What's the first line of the request source?
- How do the request headers of this request differ?
- What is the content of the POST request?
Open Chrome and open the developer tools window. Open the schedule page for this class. Click on the Elements tab. As you mouse over the HTML source, you'll see the corresponding parts of the page highlighted.
Open cs.calvin.edu page. Click the Network tab and control-reload the cs.calvin.edu page.
Now click on the "cs.calvin.edu" hit to expand it. Click on the Headers tab, and then click on "View source" beside Request Headers.
Now look at the response headers. Click on "view source" to see them in the original form.
Having to download so many files and so much data causes the page to load more slowly. Can you think of ways to make this page load more quickly?
Now open this Forms GET example in another tab. Enter a name and click "Submit Query".
View the source of the Web page. You can see the name you entered in the HTML. How did that get there? The answer is that there is a line of PHP in the Web page that you can't see. The line looks like this:
<h2>Hello <?php echo $_GET["name"] ?></h2>
The funky middle part, <?php echo $_GET["name"] ?>, is PHP code, which is interpreted by the server. We'll study PHP later, so for now, take it on faith that that line returns the value of the name variable in the URL. In fact,
Still on the Forms Example page, in Chrome's developer console, view the request header source.
Now open this Forms POST example Forms POST example in another tab. Enter a name and click "submit".
Click "view source" beside Form Data to see the raw content of the request sent to the server.
Apache log files
- How often is your server configured to rotate logfiles? Hint: ls -l might give you a clue.
- Uncompress the largest logfile you see with a command such as gzip -d access.log.2.gz if it is compressed and view the contents of the file. What are the first seven items in each line? (You may have to google "apache common logfile format" to figure out what they are.)
- Find a request that resulted in a "File not found" (response code 404). What file was requested?
- Has a crawler or spider found your site? Which one?
- Look in the error log. What caused the most recent server error?
Apache's logfiles are in /var/log/apache2. Log into your VM if you haven't already, cd into that directory, look at the files. Logfiles are "rotated" every so often, i.e. the old one is compressed and a new one is created. The active logfile is access.log, and if it is rotated in a week, it will be changed to access.log.1, access.log.1 will be compressed and renamed as access.log.2.gz, etc.
Turn in your written answers on the sheet provided or submit them via email.