The World Wide Web

For this semester, the protocol on top of TCP/IP we will be interest in is called HTTP (Hypertext Transfer Protocol).
It is used to retrieve from servers hypertext documents (one's with links and images. i.e., HTML) over the internet.
It was first proposed in 1989 by a group including Tim Berners-Lee at CERN.
The World Wide Web is the collection of servers and client that use this protocol.

Web Browsers

Web Browsers are clients used to request hypertext documents from HTTP servers.
The first browser developed by Berners-Lee was called WWW.
The first widely used browser was NSCA Mosaic.
It served as the basis for the first commercial browser Netscape.
The most common modern browsers are: Internet Explorer, Edge, Chrome, Firefox, Safari, and Opera.
Under the hood, browsers use a layout engine. For example, Internet Explorer uses Trident, Edge uses EdgeHTML, Firefox uses Gecko, and Safari, Chrome, and Opera, including on mobile platforms use some variant of WebKit.
The site evolt.org has executables for many old browsers.
Today, as indicated by the wide-spread use of WebKit, most cell phones have browsers which support W3C compliant HTML and Javascript/ECMAscript.
As a web programmer you should code to standards not any particular browser. In fact, large organizations (such as SJSU) might be required to produce only pages which conform to standards such as accessibility standards.

Web Servers

The most common servers of web documents according to Netcraft as of Jan, 2016 are Apache (~33.5%), IIS (~26.6%) (Microsoft Internet Information Server), nginx (15.6%), and Google (2.3%, only runs on Google servers).
As Apache is free, I expect you to have it downloaded and installed by the time the first homework is due.
There are two main variants of Apache: 2.x and 1.3.x. It should not matter which you use for this course, although I would discourage using the older 1.3.x.

Web Server Operation

In a typical exchange between a browser and a web server, the browser telnets into port 80 of the web server and makes a GET request for a particular document.
A web server has two sets of directories, the root of one of these is called the document root of the server. The web server looks in this directory to try to find the file to service the client's request.
The root of the other directory the server uses is called the server root. Under it is stored the server and its support software.
To initiate an exchange as above, the user typically supplies the browser with the protocol, say http; the machine, say peano.mynetwork.org; and the path to the file /index.html in one string
```
http://peano.mynetwork.org/index.html
```
called a URL.

Apache

This is the most common web server.
It originally had three configuration files. In modern usage, it has one httpd.conf file which may be self-contained or may load several other additional configuration files.
Configuration files consists of a bunch of lines in a pseudo-tagged based language. # is used for comments.
Here is a brief list of common directives:
- ServerName --- names the server system
- ServerRoot --- path to the server root
- DocumentRoot --- path to the document root
- LoadModule --- loads a module (like PHP to be used with the server)
- AddModule --- makes the added module available for use
- AddType --- associate a file name extension with a MIME type.
- Alias -- alias a URL path to a physical directory path
- <Directory> </Directory> --- control how the contents of a particular directory can be served. .htaccess files
Even if you don't have access to the httpd.conf file, if the webserver admin allows it, you might be able to use .htaccess files in the directories you control.
An .htaccess file allows you to do configurations similar to what can be done in <Directory></Directory> tags.

Example of an .htaccess File to Password Protect a Directory

AuthUserFile  "/Volumes/Library/WebDocuments/library/.htpasswd"
AuthGroupFile /dev/null
AuthName library
AuthType Basic

<Limit GET POST>
require valid-user
</Limit>

MIME

MIME stands for Multipurpose Internet Mail Extensions.
It was originally developed as a way to send attachments containing non-text documents over the internet.
Nowadays, it provides a way for a browser to determine the format of the documents it receives from the server.
A MIME specification has the format:
```
type/subtype.
```
The most common types are text, image, video.
Some example complete specifications are: text/plain, text/html, image/gif, image/jpeg, video/mpeg.
In addition to the above, you sometimes see types such as application/xhtml+xml, application/xml, or experimental types which begin with an x-. For example, video/x-msvideo

HTTP

The details of HTTP (hypertext transfer protocol) can be found in RFC 1945 (HTTP 1.0), RFC 2616 (HTTP 1.1), and RFC 7549 (HTTP/2). Additional specifications for things like security, links to which can be found at the W3C HTTP Spec page.
Most of the messages between HTTP 1.1 and HTTP/2 are the same, however, HTTP/2 does a number of tricks to improve how quickly a browser can obtain resources needed to render a page. We will focus on HTTP 1.1 and HTTP 1.0.
HTTP consists of two phases, the request and the response.

A request has the format:

HTTP method  path part of URL  HTTP version
Header fields
Blank line
Message Body

For example, at a Unix prompt trying typing:

For example, at a Unix prompt trying typing:
telnet www.cs.sjsu.edu 80  
GET / HTTP/1.0
<blank line>

More HTTP

The most commonly used HTTP requests are:

GET --- request contents of specified document
HEAD --- request header contents of specified document
POST --- Executes the specified document, using the enclosed data
PUT --- replaces the specified document with the  enclosed data
DELETE ---deletes the specified document.

Of these, GET and POST are the most common.

Header Fields

After the first line of the HTTP request one can have any number of header fields.
There are four kinds of headers: general, those used in the request, those used in the response, and entity headers which are used in both.
Two common headers are:
- Accept: says what MIME types the browser can handle
- Host: (required in HTTP/1.1) Says the name of the host that you are trying to contact. Host is useful because www.widgets.com, www.sprockets.com might be hosted on the same machine (virtual hosting). This says which one you are trying to contact.

As an example:

GET /respond.html HTTP/1.1
Host: blanca.uccs.edu
Accept: text/*
Accept: image/gif

Response Phase

An HTTP response has the following format:

Status line
Response header fields
Blank line
Response body

An example status line might be:
```
HTTP/1.1   200   OK
```
In general, one will have a 3-digit status code and a message. The codes come in one of five categories: 1 - information, 2 success, 3 - redirection, 4 - client error, 5 - server error.

An example response header

HTTP/1.1 200 OK
Date: Mon, 28 Aug 2006 19:09:45 GMT
Server: Apache/2.2.2 (Fedora)
Accept-Ranges: bytes
Connection: close
Content-Type: text/html
In the above, Date:, Server:, Accept-Ranges:, etc are all response fields.

HTML/XHTML

HTML was original specified in the Standard Generalized Markup Language (SGML) which is an ISO standard for specifying text-formatting languages.
HTML was designed to specify content rather than how it was formatted (presentation).
The reason was to allow it to be displayed in as many different kinds of computers and browsers as possible.
As a specification language for simple tag based languages, SGML is severe overkill, so a stripped-down specification language called XML was developed in the late 90's.
XHTML is HTML specified using XML.

HTML Variants

The most common variant of HTML today are:

ISO HTML (HTML 4.01) which is specified using SGML a
XHTML 1.0 Transitional
XHTML 1.0 STRICT
XHTML 1.1
HTML 5/XHTML 5

XHTML 2.0 has been under development for several years, but looks like it is being abandoned.
HTML 5/XHTML 5 is a stable W3C recommendation as of October 2014.
HTML 5.1 is under development as of February 2016.

Basic Syntax

The fundamental structural unit of HTML is a pair of tags.
For example, a paragraph might be specified with: <p>The quick brown fox..</p>
Here <p> is called the open tag and </p> is called the close tag. The quick brown fox is the content of the tag.
XHTML documents are case sensitive -- tags must be lower case for the document to validate. HTML documents can be case insensitive.
To be a legal XHTML document, every open tag must be closed. Further, the nesting must be legal.
In HTML 5, some tags do not need to be closed: area, base, br, col, command, embed, hr, img, input, keygen, link, meta, param, source, track, wbr .

Some examples:

<img src="my_picture.png" ></img> 
    <!-- this is okay in an XHTML document (not in HTML 5). 
    BTW, this is an example HTML comment -->
<img src="my_picture.png" /> 
    <!--this is okay for both XHTML and HTML 5 and is an abbreviation for the line above -->
<img src="my_picture.png" >  <!--okay only in HTML 5, but don't use for this class -->
<P>old style paragraph</P> <!--okay only in HTML 5, but don't use for this class -->
<p><i>Hello</i></p> <!--okay -->
<p><i>Hello</p></i> <!--not okay -->

Open tags may have attributes. For example, src in the image tag above. The value of an attribute must be given in double quotes or single quotes for XHTML. Quotes are optional for HTML 5.

For this class, I want you to use XHTML syntax because it will work in the HTML case and gives your documents greater flexibility and makes it easier to find bugs.

More HTTP, HTML, XHTML

Outline