What's inside HTTP request ?๐Ÿค”

What's inside HTTP request ?๐Ÿค”

ยท

3 min read

Hello readers!

if you are new to programming or web development, you must have heard the words request and response probably when consuming third party API to get data for your projects and tutorials, but do you know what's inside the request or respose and what are they made of ?

A simpler way of making an HTTP (Hypertext Transfer Protocol) is through the browser that we use daily on our computers and mobile devices. When we enter a URL like "hashnode.com" in the search bar and press enter, at this point the browser takes care of composing the HTTP request and sends it to the server.

What's inside the HTTP request ?

The HTTP request automatically composed by the browser, looks like this :

GET / HTTP/1.1
Host: google.com
User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) 
Version/11.0 Mobile/15A372 Safari/604.1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,
image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3
Accept-Encoding: gzip, deflate
connection: keep-alive

Let's take a closer look at the first line of the request:

GET / HTTP/1.1

This line contains three elements:

  1. GET - the HTTP method to use, it's used to retrieves the resource and in this case it will fetch the resources at the root of the website. Some other commonly used HTTP methods :

    POST - used to send data to server.

    PUT - updates an existing resource or creates a new resource with the content in the request body.

    DELETE - deletes the specified resource.

  2. The HTTP version 1.1, which tells the server which version to use for the response and defines the structure of the message.

  3. The domain name of the URL, i.e google.com.

HTTP requests also include headers which looks like this:

User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) 
Version/11.0 Mobile/15A372 Safari/604.1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,
image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3

HTTP request headers provide information so that the server can send a suitable response. In the above example

User-Agent - helps identify the application type, operating system, software version etc.

Accept - tells the server what types of data can be sent back.

Body The last part of an HTTP request is the request body also called payload. All requests don't have a body but some requests which send data back to the server to update it do have a body, for example, a POST request containing form data.

Now you should have a general understanding of what information is sent by the browser over HTTP to the server but there's actually a lot more happening under the hood and if you want to learn more about the request-response cycle here's a link to mdn docs - developer.mozilla.org/en-US/docs/Web/HTTP/M..

Have a nice day ๐Ÿ‘‹.

ย