1. Web application architecture
And protocols of the www
CS-4220 Dr. Mark L. Hornick

2. Q: What does a Browser do?
Web Browsers
CS-4220 Dr. Mark L. Hornick

3. The www message model consists of Requests and Responses
Client Request: “I need a resource (html page, picture, pdf doc, mp3 file…)”
Q: How does a user initiate a request?
Resource access
Web Browser (the client)
Server Response: “Here you go!”
Web Server
CS-4220 Dr. Mark L. Hornick

4. A three-tier model (Client, Server, Database) is a common web application architecture
Web Server
Database
Databases are often on a separate server, but not always.
Q: What’s in the lightning bolts ??
CS-4220 Dr. Mark L. Hornick

5. How are messages sent back and forth?
Request: Internet message from Client to Server
router
router
router
router
router
Generic Client
Generic Server
Response: Internet message from Server to Client
CS-4220 Dr. Mark L. Hornick

6. Review of TCP sockets from SE2811
Demo
CS-4220 Dr. Mark L. Hornick

7. Packaging a message for delivery
Internet message from Client to Server
Application-specific data of the message
router
router
router
router
router
Generic Client
Generic Server
Ethernet Frame Header
IP Header (address of Server)
TCP Header
(Part 1 of N)
Application-specific data of the message
Ethernet Frame Footer
Internet message packet
CS-4220 Dr. Mark L. Hornick

8. Peeling the onion of an internet message
Ethernet Frame Header
IP Header (address of Server)
TCP Header
(Part 1 of N)
Application-specific data of the message
Ethernet Frame Footer
CS-4220 Dr. Mark L. Hornick

9. How a browser initiates a request: anatomy of a url
The most commonly used form:
Represents the DNS name of the server which listens for HTTP requests on port 80
The complete url is really: where the prefix explicitly instructs the browser to communicate using the http protocol, and the :80 suffix instructs the browser which port to use, and /index.html is the path of the resource to be retrieved.
When the protocol and port are omitted, the browser assumes http and 80
Index.html is one of several default files the server looks for when none is specified by the browser

10. Other protocols and ports can also be specified
specifies that a secure version of HTTP (using SSL) should be used (recall from CS2910)
:8443 is a commonly-selected port that servers use for https.
/OnTrack/login.jsp is the path to a web page being requested by the browser
CS-4220 Dr. Mark L. Hornick

11. Browsers can use protocols other than http
ftp://myfiles.msoe.edu/public/pictures/dog.jpg
ftp:// specifies that the browser should use the ftp protocol to retrieve the specified resource
The default port for ftp is used unless specified explicitly
file:///D:/MyDocs/SampleHTML/BasicHTML.htm
file:// specifies that the browser should retrieve the specified resource directly from the filesystem
The filepath syntax is specific to the operating system running the browser (Windows in this case)
CS-4220 Dr. Mark L. Hornick

12. The sequence for retrieving a static web page (no db needed)
Note: This diagram can be found in your textbook
Browser formats the request and sends it to the server
…or types a url into the address bar
HTML (and other) files
Server formats the response and sends it to the client (browser)
CS-4220 Dr. Mark L. Hornick

13. HTTP: The message protocol of the www
HTTP request
Simple page fetch…
Web Browser
HTTP response
Web Server
Q: Does a response always carry a payload?
CS-4220 Dr. Mark L. Hornick

14. The HTTP GET Request is the most commonly issued message
GET requests the retrieval of a resource specified via a URL
Example:
URLs you type into the address bar of a web browser are always formatted into GET Requests:
GET /hornick/Courses/cs4220/mypage.htm HTTP/1.1
Host: people.msoe.edu
Accept: */*
<CRLF>
CS-4220 Dr. Mark L. Hornick

15. Request / Response illustrated
Note: This diagram can be found in your textbook
CS-4220 Dr. Mark L. Hornick

16. Of all other HTTP requests, POST is the only one commonly used
Submits data to be processed (commonly from a HTML form) to the identified resource. The data is included in the body of the request. The data thus provided typically changes the state of the web application. More on this later.
PUT
Uploads a representation of the specified resource.
DELETE
Deletes the specified resource.
TRACE
Echoes back the received request, so that a client can see what intermediate servers are adding or changing in the request.
OPTIONS
Returns the HTTP methods that the server supports. This can be used to check the functionality of a web server.
CONNECT
For use with a proxy that can change to being an SSL tunnel.
HEAD
Asks for the response identical to the one that would correspond to a GET request, but without the response body. This is useful for retrieving meta-information written in response headers, without having to transport the entire content. .
CS-4220 Dr. Mark L. Hornick

17. Wfetch is free HTTP protocol viewer
Live link on course webpage under Tools.
CS-4220 Dr. Mark L. Hornick

18. Use Wfetch for http://people. msoe. edu/~hornick/Courses/cs4220/mypage
CS-4220 Dr. Mark L. Hornick