Scribd
Upload
10 views11 pages

15 HTTP

The document provides an overview of the Hypertext Transport Protocol (HTTP), detailing its structure and function in web applications. It explains how HTTP operates through a request-response model, including common methods like GET, POST, and their associated status codes. Additionally, it discusses browser caching and the implications of HTTP on web application performance.

Uploaded by

noor-alnaser1
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
10 views11 pages

15 HTTP

The document provides an overview of the Hypertext Transport Protocol (HTTP), detailing its structure and function in web applications. It explains how HTTP operates through a request-response model, including common methods like GET, POST, and their associated status codes. Additionally, it discusses browser caching and the implications of HTTP on web application performance.

Uploaded by

noor-alnaser1
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 11

Hypertext Transport

Protocol (HTTP)
Bashar Al shboul

Adopted from Mendel Rosenblum


Web Application
Architecture Web Server /
Web Browser Application server Storage System

HTTP

LAN
Internet

2
Universal Resource Locator (URL)

http://www.example.com:80/
index.html
● To display page browser fetches the file index.html from a web server
Same as www.example.com (Defaults: port 80, file index.html, http
protocol)
● HTTP (HyperText Transport Protocol)
● HTTP - Simple request-response protocol layered on TCP/IP

1. Establish a TCP/IP connection to www.example.com:80

2. Send a http GET request along connection


3. Read from the connection the response from the web server
Send HTTP Request - Write lines to socket
Method URL Protocol Version

GET /index.html
HTTP/1.1 Host:
www.example.com User-
Header Agent: Mozilla/5.0
Accept: text/html, */*
Accept-Language: en-
us
Accept-Charset: ISO-8859-
1,utf-8 Connection: keep-
Body alive
(optional)
blank line
HTTP Methods (Verbs)
● GET - Fetch a URL
● HEAD - Fetch information about a URL
● PUT - Store to an URL
● POST - Send form data to a URL and get a response back
● DELETE - Delete a URL

GET and POST (forms) are commonly used.

REST APIs used GET, PUT, POST, and

DELETE
HTTP Response - Read lines from socket
Version Status Status Message

HTTP/1.1 200 OK
Date: Thu, 24 Jul 2008 17:36:27
Header GMT
Server: Apache-Coyote/1.1
Content-Type:
text/html;charset=UTF-8 Content-
Length: 1846
blank line
Body <?xml ... >
<!DOCTYPE html ... >
<html ... >
</
Common HTTP Response Status Codes
200 OK Success
307 Temporary Redirect Redirection - Browser retries using Location header
404 Not Found Famous one
503 Service Unavailable Something crashed on the server
500 Internal Server Error Something is messed up on the server
501 Not Implemented Coming
400 Bad Request Use if web app sends bogus request
401 Unauthorized Use if user isn't logged in
403 Forbidden Use if even logging in wouldn't help
550 Permission denied Not allow to perform request
WAPE Lecture Notes - HTTP 8
Browser caching control
HTTP Response Header: Cache-Control: max-age=<Seconds>

Browser can reuse reply younger than the max-age

Cache-Control: max-age=120 - Age out in two minutes.

Frequently used on fetches of static content like images, templates, CSS,


JavaScript.

Good: Reduce app startup latency and server load


Bad: Changes might not be picked up right away

Consider Web App changes?


Browser spends its life fetching things using HTTP
● Some fetched immediately (processing paused while waiting for HTTP reply)
<link href="angular-material.css" rel="stylesheet" />
<script src="compiled/p2.bundle.js"
type="text/javascript" /> window.location =
"http://www.example.com";
● Some asynchronous and in parallel
<img src="smiley.gif">
<img src="foobar.jpg">
<img src="foobar2.jpg">
● Some can be in background
<a href="http://www.example.com"></a>
GET http://localhost:3000/favicon.ico 404 (Not Found)
What would this JavaScript do?
elm.innerHTML =
"<script
src="http://www.example.com/myJS.js"
type="text/javascript" ></script>"

Uses HTTP to fetch myJS.js and runs it! Scary but useful.

You might also like