Decoding HTTP Headers(Basic)

HTTP header = Meta-data = data about HTTP data being send or received.

We know HTTP is based on a client-server model. The client can be from any part of the world, and the server can be from any part of the world. The client can use any browser like chrome/Mozilla installed on any OS like Windows, Linux, etc. If the client only accepts language says ‘Tamil’ and the server only has English language contents. What to do?

This metadata(i.e., data about data) is sent in HTTP headers.

Basic Structure of HTTP:

The body contains actual data — can be HTML text, JSON, etc. Headers contain meta-data about actual data.

Note: Empty line separates header and body.

HTTP is based on messages.

From client to server -The request and corresponding header are the Request Header.

From server to client — The response and corresponding header are the Response header.

Request Headers

Accept

What type do I accept? They are called MIME type(explaining MIME is beyond the scope of this article).

Syntax: type/sub-type

e.g.

Accept: text/html - here type is text and sub-type is html. 
Accept: image/* - here, type is an image, and sub-type can be anything like jpg, png, etc. 
// General default 
Accept: */ * - Accept any type and sub-type.

Accept-Encoding

What type of encoding do I use in the browser?

Encoding = Changing from one form to another. It is usually done for the compression of data.

What compression algorithm client can understand?

Accept-Encoding: gzip 
Accept-Encoding: compress 
Accept-Encoding: deflate 
Accept-Encoding: br 
Accept-Encoding: identity 
Accept-Encoding: *

Accept-Language

What language can I accept? It can be based on region(locale).

Syntax: Accept-Language: <language>

accept-language: en-US - accepts English of US 
Accept-Language: en-US,fr-CA - accepts English of US and French of Canada 
Accept-Language: * - accepts all languages.

It is essential to understand quality value syntax here. This is like giving weightage to prioritize.

accept-language: en-US,en;q=0.9

Here en-US has a priority of 1.0, and en has a priority of 0.9.

Note: This quality syntax is used in many headers.

Authorization

This is useful when clients access the private resources on the server.

Private = Only the allowed user can access the resource.

This involves authenticating the user to access or manipulate the resource. They are primarily used in API.So if you build an API, you need to have an authentication method to access your API.

There are many authorization techniques.

1)Basic Auth — Basic <base64 encoded string>

2)Bearer token — Bearer <token> → token generated by server

3)API key

etc.

Note:

The API key can be sent as query params

example.com/?api_key=<key>

or a separate header

X-API-Key: <key>

Connection

We know that HTTP is based on TCP underlying it. In HTTP 1.0 TCP is closed once you have the response from the server but in HTTP 1.1, your connection will be active for subsequent requests and responses cycle.

Connection: keep-alive --> default for http 1.1 
Connection: close

Content-Length

It is the size of data in the body. It is in bytes.

content-length: 6553

Content-Type

This is useful when you send a post or put a request. What type of content do I send to the server?

Here content type can be text/plain,text/Html,multipart/form-data etc.

multipart/form-data must have a boundary in syntax.

Content-Type: multipart/form-data; boundary=something

The boundary is useful because any form submitted using the post method contains the name: value pairs. Therefore each name-value pairs are separated by a boundary. The boundary is a set of characters without white space between them.

Please visit this page for example.

Host

This is one of the major differences between HTTP 1.0 and HTTP 1.1.

This enables virtual hosting in a way because the server or a machine has a single IP address. A single server can host many resources like abc.com and xyz.com.Even if we reach the correct IP address, the server doesn’t know which resource it gives xyz or abc. That’s where the host header comes in.

Host: <host>:<port> 
e.g. abc.com:443

User-Agent

This is the most important header. The server identifies what web browser and OS of the client. Format of web browser user-agent is different and tricky. But the purpose is the same(to identify browser type and OS installed on it).

Response Headers(From server perspective)

Access-Control-Allow-Origin

What origin do I allow?

Origin = combination scheme, domain, and port.

Access-Control-Allow-Origin: * --> allows all origin Access-Control-Allow-Origin: <origin> --> example.com

Allow

What are the http request methods allowed?

Allow: GET, POST, HEAD

Content-Disposition

Some data from the server is not intended to be displayed inline on the web page. They are meant to be downloaded.

Content-Disposition: inline 
Content-Disposition: attachment 
Content-Disposition: attachment; filename="filename.jpg"

Content-Encoding and Content-Language are the same as the request header but from the server perspective.

Similarly, the Server header is equivalent to User-Agent in the request header.

We will see cache and cookies concepts along with the corresponding header in the next article.

Originally published at https://www.pansofarjun.com on August 14, 2022.