HTTP (Hyper Text Transfer Protocol)

In the OSI Model, you learned that the 7th layer, called the Application Layer, is where the HTTP protocol is used to communicate over the network. Let us learn more about this protocol and its methods in this lesson.

The Request-Response Cycle

At the root of all communication is the request-response cycle. When the client contacts a server for a resource, the client is making a request, and the server processes the request and then responds with a response. In the browser, it is the HTTP protocol that helps in establishing this request-response cycle.

Methods of HTTP Protocol

The HTTP protocol defines various methods that you can use to send your request. The popular request methods of the HTTP protocol are as follows:

GET

This is used to retrieve a resource from the remote server. A classic example is a Google search, where search terms are sent as query parameters. If the GET method is used in a form, then all the form elements will be appended to the URL as query parameters. Query parameters can potentially be logged or seen by any of the Internet Service Providers (ISPs) en route to the web server, and hence the GET method should not be used to send sensitive form data like passwords, credit card details, etc.

Have you noticed that your request in any Google search is appended to the URL as a query parameter?

Example 1

Try searching for mobi boot camp in the Google search box, and you will see the below URL along with many other query parameters appended to the main search term:

https://www.google.com/search?q=mobi+boot+camp...

Example 2

Here are the complete request and response values for our dictionary service using GET.

Open your browser's Developer Console, select the 'Network' tab, and then invoke the dictionary service URL @ http://mbcc-words.appspot.com/words?w=introvert to see the below values:

More on Request Headers

Request headers contain a lot of information that includes the HTTP method used in the request, the cookies that are written by the remote server on the browser in any prior visit, the user's browser and computer details, etc.

More on Response and Response Headers

Once the backend server processes the given request, it sends the response. Your developer console's network tab is updated with the response information the moment it receives the response from the backend server.

You can see the full response by clicking on the Response tab of your developer console.

Since the backend server sent JSON content, you see a JSON string in the above image. However, any GET request for an HTML page will show HTML content in the Response tab.

In the Headers tab, the main response section contains details that include the status code of the request, the remote IP address, the specific HTTP method used to make the request, etc.

The response headers section contains a lot of information that includes the type of content received, content length, along with the server's details.

Some points to note:

• GET requests can be saved in the browser history.
• GET requests can be bookmarked.
• Since GET appends query parameters to the URL, there are length restrictions with browsers, and it may not work with very long URL strings.
• GET requests are meant for read-only data and should not be used for data modification.

POST

This is used to send user input to the remote server. Classic examples for using the POST method are a login form carrying a username and password, or a program registration form carrying the sensitive details of the person who is registering. Form elements are not appended as query parameters; instead, they are sent as form data tucked inside the body. Just sending the request using POST will not be sufficient to send sensitive information; it should also be sent using secure HTTP, called HTTPS (S - secured through SSL certificates).

Some points to note:

• POST requests can be saved in browser history.
• POST requests cannot be bookmarked.
• POST requests have no restrictions on data length.

Other HTTP methods

Although GET and POST are the most commonly used methods, there are a few other methods of the HTTP protocol, which are briefly mentioned below:

• PUT - is used to send data to a server to create/update a resource. It is the same as POST, but multiple PUT invocations should not produce different results, whereas multiple POSTs can.
• HEAD - is almost the same as GET, but without the response body.
• DELETE - should be used to delete the specified resource.

HTTP Status Codes

In all our examples, you have seen the status code 200. This code number indicates that all went well. Here are other common status codes:

A complete list of all the codes can be referenced here: https://developer.mozilla.org/en-US/docs/Web/HTTP/Status

In fact, the following should be noted:

• Successful codes are between 200 - 299.
• Redirection codes are between 300 - 399.
• Client request errors are between 400 - 499.
• Server errors are between 500 - 599.

MIME (Multipurpose Internet Mail Extension) types

The data that is sent from the remote server could be of any type. You have seen JSON and HTML types so far. But it could also be binary image files, media files, etc. To specify the data type so that the browser can open a suitable application on the user's computer to process the file, a MIME type is used.

The same concept is true for data sent from the client to the server. It could be of any type. The client may be sending a plain text file, an HTML file, a media file, etc.

Hence you can specify the MIME type in both the accept-header of the request and the content-type header of the response.

Here is a list of common MIME types:

Browser Cache Management

Every browser has the ability to cache the response content after receiving the response from the remote server. This is very useful for saving internet bandwidth for files that are frequently visited by the user. For cached files, the browser will not make a backend request but will get the file from its local file system. This technique helps in retrieving image files, static files, etc. However, sometimes you do not want the browser to cache the response; instead, you want the browser to fetch the latest file every time a request is made. This is a requirement for frequently changing files. You can instruct the browser to always fetch the latest file by setting the cache-control=no-cache in the response header.

There are other values too that you can set. Reference: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control