Internet Applications (Cont’d)

• Basic Internet Applications– World Wide Web (WWW)• Browser Architecture• Static Documents• Dynamic Documents• Active Documents• HTTP

1

WWW: How A Browser Works• WWW project was initiated by CERN

(European Laboratory for Particle Physics) to create a system to handle resources necessary for scientific research.

• Web browsing uses client-server paradigm

• Browser: – Makes TCP connection – Sends request for page – Reads page

• If a page contains several images, Each different item - e.g., <IMG> tag (image) - requires separate TCP connection

• HyperText Transport Protocol (HTTP) specifies commands and client-server

interaction

2

Fig. 22.1 (text book)

How The World Wide Web Works• Use client-server interaction• The client:

– browser program uses the Internet to contact a remote server

• The server:– returns a copy of the requested page

with additional information• A URL (Uniform Resource Locator)

tells a browser which server to contact– Each URL uniquely identifies a page

of information by giving the name of a remote computer and a specific page of information available from the server

• URL specifies– an access protocol– the domain name of the remote

computer on which the server runs

– any specific item

3

Fig. 22.7 (text book)

Inside a Browser Program • Examples: Netscape Communicator, Microsoft IE• A Web Browser Architecture usually consists of 3 parts:

– controller:• receives and interpret input from the keyboard or the mouse • calls other components to perform operations specified by users (e.g.,

uses a client program to access a document)

– client programs: uses different protocols• HTTP client fetches HTML documents from WWW server• optional clients: FTP client and E-mail client• FTP client - access file transfer service• E-mail client - send & receive e-mails

– interpreters:• HTML interpreter displays HTML-formatted documents

4

Inside a Browser Program

5

Web Documents• Documents in WWW can be grouped into 3

categories: – static documents:

• fixed-content, created and stored in the a server. – dynamic documents:

• created by a Web server whenever a browser requests the document.

• contents can vary from one request to another.– active documents:

• contain program to be run at the client side, e.g. animation• stored in the form of binary code. • transported to the client in a binary form.

6

Static Documents

7

Fig. 24.1 (text book)

(1) A user enters a URL, causing a browser to contact a Web server and request the item

(2) the server extracts the specified item from its local disk and sends a copy to the browser.

Dynamic Documents

8

Figure 24.3 (text book)

(1) A browser requests a URL that corresponds to a CGI program, causing the server to start the program

(2) the CGI program computes a response, which the server returns to the browser.

Dynamic Documents• Dynamic documents:

– e.g. documents generated using CGI

• A server follows these steps:– it examines the URL to find if

it defines a dynamic document, e.g. with extension .cgi

– if it is dynamic, then it executes the program.

– it sends the output of the program to the client.

9

Active Documents

10

Figure 24.4 (text book)

(1) A browser requests a URL that corresponds to an active document,

(2) Server sent a copy of active program to client (browser)

(3) the browser runs a copy of the active document, which then controls the screen.

Active Documents• Active documents:

– e.g. documents containing Javascript.

• Its execution is as follows:– the binary code of the program is

created and stored at the server side.

– upon client request, the binary code is transported to the client.

– the client uses its own software to change the binary code into executable code.

– the client runs the program.

11

Comparing Static, Dynamic & Active Documents

• Static Document• Advantages:

– Simplicity: straightforward formatting specifications – can be created by non-technical person

– Reliability: after it has been created and tested thoroughly, a static document remains valid indefinitely

– Performance: browser can (1) display static documents more rapidly and (2) place a copy on cache to speed up future requests

• Disadvantage:– Inflexibility: must be revised whenever information changes; not

useful for reporting information that changes frequently

12

Comparing Static, Dynamic & Active Documents

• Dynamic Document• Advantage:

– Able to report current information• Disadvantage:

– Increase cost: more expensive to develop than static document– Inability to update information continuously: Do not deliver a continuous

stream of images

13

Comparing Static, Dynamic & Active Documents

• Active Document• Advantages:

– ability to update information continuously– Ability to change the display quickly enough to show an animated image

• Disadvantage:– Additional cost (more programming skills needed, requires more sophisticated

browser software and more powerful computer)

14

HTTP

• HTTP (Hypertext Transfer Protocol)– protocol used to access data on the WWW.– uses one TCP connection on well-known port 80.– two types of http messages: request, response– transfer data in the form of plain text, hypertext,

audio, video, and so on.– data transferred look like SMTP messages (see

Lecture note 2).

15

HTTP• HTTP requests use the concept of resource locator (URL).• In more detail, URL defines four things: method, host computer, port and

path– Method is the protocol used to retrieve the document, e.g. FTP, & HTTP. An

access protocol (see slide 3)– Host is the computer where the information is located. Domain name of the

computer (see slide 3)– Port: port number of the server (optional)– Path is the pathname of the file where the information is located. Specify a

specific item to request (see slide 3)

16

HTTP: Request and Response

17

HTTP: Request and Response

18

Status Line

Request Line

HTTP Example: Retrieving a File

19

HTTP Example: Retrieving a File• Request line

– request type (method): GET– path: /usr/bin/image1– HTTP version: 1.1

• client can accept images in GIF and JPEG formats• status line:

– HTTP version: 1.1– status code (a 3 digit number): 200– status phrase: OK (200 OK indicates request is successful)

• Header lines defines:– date: 04-Jan-99– server name: challenger– MIME version: 1.0 - (MIME (Multipurpose Internet Mail Extensions) is an SMTP extension

to allow non-ASCII data to be sent through SMTP.)– length of document: 2048 bytes

20