the HTTP protocol & how the web works
The HTTP protocol
HTTP = __H__yper__t__ext __T__ransfer __P__rotocol
the HTTP is an application layer protocol that allows web-based applications to communicate and exchage data
the HTTP is the messager of the web
it is a TCP/IP based protocal
it is used to deliver contents,for example,images,videos,audios,documents,etc
the computers that communicate via HTTP must speak the http protocol
Three important things about the HTTP
1. HTTP is connectionless
after making the request,the client disconnet From the server,then when the response is ready the server re-establish the connection again and deliver the response
2. HTTP 's deliver variation
the HTTP can deliver any sort of data,as long as the two computers are able to read it
3. HTTP is stateless
the client and server know about each other just during the current request,if it closes,and the two computers want to connect again,they need to provide information to each other anew,and the connection is handled as the very first one
Why The HTTP
The HTTP was designed mainly to fetch html documents and sends it to the client
at the time 1991,it was created only for fetch html documents,not videos ,audios etc, it was designed for web.
It was designed in a exquisite way
It was being continually evolved and features were being added to it
It became the most convenient way to quickly and reliably move data on the web
How the Web works ? And How HTTP makes that possible
The URL format is:
schme://domain:port/path?query_string#fragment_id
schme: http,https,ftp,etc.
domain: www.google.com,etc.
port:80(default),3000,etc.
path:path_to_the_resource,this can be a series of folder names if you're getting a static web page that ends in the name of the file and its extenion
URLs also appear in HTML tags inside the resource,these can be for other resource like images,javascript,css, the attributes in these tags contain URLs that tell the browser go to location. for example:
<a href=URL> //when user click this, go to that page
<img src=URL> // go to this location and go get the file,it's a image, i wantto display it.
<script src=URL> // go to this location get the js and i want to run it.
<link rel=URL> //go to get the css , i want to render the page
URLs also appear in HTML tags for resources used in the page(fetched automatically) and,of cource,hyperlinks(fetched on click).
If you type “www.mywebsite.com/products/my.html”, what will happend?
-
1st , THE INTERNET will establish the connection of the two computers(client and server),using the TCP/IP suite of protocols ,it establish the connection using a combination of cable media and wireless media and do all the necessary work to prepare the environment for the two computers to talk via the HTTP protocol.
-
2nd, when the connections establishs,the client sends a request called a HTTP message and because the HTTP is a connectionless protocol the client disconnects from the server,waiting for the response .
-
3rd, the server on the other side process the request ,prepare the response, and establishes the connection again and send back the response again in form of an HTTP message to the client.
-
4th, the client(browser) accept the html file and parses the HTML,parsing is a word that means it goes and gets the file and breaks it up into pieces,and then starts trying to figure out what to do with all the pieces,HTML contains the text content for a web page plus the structure of the web page,and also ,HTML contains links to other resouces (js,link,CSS,img),the next thing the browser does is it goes out and using those UTLs,it fetch those resources if there are images that the web page needs or videos or anything . the browser goes out and requests those files ,while those files are coming back it goes out and it looks for any CSS that it needs, Finally,the web browser is going to go out and find any JavaScript files that the web page needs and its going to request them as well. JavaScript is how we described how a web page should behave nce it’s all loaded and ready to go.
the order of the fetch looks like:
1. HTML(content,structure,URLs) 2. Media(content) 3. stylesheet/CSS (appearance) 4. JavaScript(perfomance)A browser has a couple of simple behaviors that it knows how to do automatically,such as click a form submit button,it knows how to submit a form, but for all the other things you want a web page to be able to do all the enteractive elements you use JavaScript. And the web browser goes out and ask for all of these files using those get commands, the various servers that contain these resources send them back,this can take a while, but as they return, the browser assembles them(HTML,Media,CSS,JavaScript) into the document,and stores it’s work in an internal data strcture of some sort different for every browser, but in the end , the point of these whole exercise is for it to render this document,that is to draw the document on the screen,it renders a visible page and puts it in the window of your browser . It also publishes the document as a document object model(DOM), DOM is a standard way to describe web page and other documents that allows us to traverse them and manipulate them,if you write a JavaScript ,the browser(internal data strctures) will execute it ,the JavaScript run and they use the DOM to manipulste the web page.In fact, the browser doesn’t run the JS at the end time, the browser run scripts at different times as soon as it finds them(documents or particular parts of the documents).
-
5th, then the two computers completely disconnect.
HTTP message
A typical HTTP message include 3 parts: Start line, Headers,Body, they all contain plaintext information ,unless if the Body contains binary data,but in general, HTTP messages are plaintext and easy to read. The information in the three sections very dependent on the HTTP message whether it is a request or a response. A request HTTP message differs from a response one.
Differs from Request and Response
| –\-- | Request http message | response http message |
|---|---|---|
| Start line | Method path/to/file.ext http/version | http/version status_code |
| Headers | Name1:value1 Name2:value2 Name3:value3 |
Name1:value1 Name2:value2 Name3:value3 |
| Body | E.g some content | E.g File requested |
lets look at each of them
Request HTTP message
| –\-- | |
|---|---|
| Start line | Method URI HTTP/VERSION ---------------------------------------------------------------------- GET /products/my.html HTTP/1.0 |
| Headers | Host:www.mywebsite.com Accept: text/html Accept-language:en-us etc… |
| Body | The Body does not exit beacuse it’s not needed |
in Start line,the HTTP vetsion is that the version that the client is using.
in Headers,the host is the address of the server to which we are sending the request. Accept-language specific the language, Accept tells the server what type of file we are requesting,it holds a MIME type as its value,MIME type looks like:
MIME Type : fileType/ext
E.g.: image/gif
E.g.: text/html
Response HTTP message
| –\-- | |
|---|---|
| Start line | HTTP/VERSION STATUS CODE -------------------------------------------------------------------------- HTTP/1.0 200: OK |
| Headers | Host: www.mywebsite.com Accept: text/html Accept-language:en-us etc. |
| Body | products/my.html |
the Response HTTP message dont have a METHOD or URI because those are specifically for the requests.
in Start line, status code tells the client if the request succeeded or failed, it may 200 or 404 or other codes,as below:
status code:
E.g.: 200:ok
E.g.: 404:file not found
Summary
- The HTTP is a TCP/IP based application layer protocol that allows web-based applications to communicate and exchange data
- The computers that communicate via the HTTP must speak HTTP
- The HTTP is stateless, connectionless,and can deliver any data
- We use HTTP ptotocol because it is a convinient way to quickly and reliably move data on the web
- The request response cycle works on the web via HTTP messages
- A HTTP message contains three sections,the start line,the headers,and the body
- The HTTP request message differs from the http response message