Client server architecture:

Computers connected to the internet are called clients and servers. A simplified diagram
of how they interact might look like this:

Clients are the typical web user's internet-connected devices (for example, your computer
connected to your Wi-Fi, or your phone connected to your mobile network) and web-accessing
software available on those devices (usually a web browser like Firefox or Chrome).

Servers are computers that store webpages, sites, or apps. When a client device wants to
access a webpage, a copy of the webpage is downloaded from the server onto the client
machine to be displayed in the user's web browser.

In addition to the client and the server, we also need to say hello to:

Your internet connection: Allows you to send and receive data on the web. It's basically like the
street between your house and the shop.

TCP/IP: Transmission Control Protocol and Internet Protocol are communication protocols that
define how data should travel across the internet. This is like the transport mechanisms that let
you place an order, go to the shop, and buy your goods. In our example, this is like a car or a
bike (or however else you might get around).

DNS: Domain Name System is like an address book for websites. When you type a web address
in your browser, the browser looks at the DNS to find the website's IP address before it can
retrieve the website. The browser needs to find out which server the website lives on, so it can
send HTTP messages to the right place (see below). This is like looking up the address of the
shop so you can access it.

HTTP: Hypertext Transfer Protocol is an application protocol that defines a language for clients
and servers to speak to each other. This is like the language you use to order your goods.

Component files: A website is made up of many different files, which are like the different parts
of the goods you buy from the shop. These files come in two main types:
Code files: Websites are built primarily from HTML, CSS, and JavaScript, though you'll meet
other technologies a bit later.
Assets: This is a collective name for all the other stuff that makes up a website, such as images,
music, video, Word documents, and PDFs.

How web works?

When you type a web address into your browser (for our analogy that's like walking to the shop):

The browser goes to the DNS server, and finds the real address of the server that the website
lives on (you find the address of the shop).
The browser sends an HTTP request message to the server, asking it to send a copy of the
website to the client (you go to the shop and order your goods). This message, and all other
data sent between the client and the server, is sent across your internet connection using
TCP/IP.
If the server approves the client's request, the server sends the client a "200 OK" message,
which means "Of course you can look at that website! Here it is", and then starts sending the
website's files to the browser as a series of small chunks called data packets (the shop gives
you your goods, and you bring them back to your house).
The browser assembles the small chunks into a complete web page and displays it to you (the
goods arrive at your door — new shiny stuff, awesome!).

Advantages of Client-Server model:

 Centralized system with all data in a single place.

 Cost efficient requires less maintenance cost and Data recovery is possible.
 The capacity of the Client and Servers can be changed separately.
Disadvantages of Client-Server model:

 Clients are prone to viruses, Trojans and worms if present in the Server or uploaded into
the Server.
 Server are prone to Denial of Service (DOS) attacks.
 Data packets may be spoofed or modified during transmission.
 Phishing or capturing login credentials or other useful information of the user are
common and MITM(Man in the Middle) attacks are common.

HTTP

It stands for hypertext transfer protocol. Using this protocol the client sends a request to the
server and based on the request the server and the web browser respond to the client.

HTTP

HTTP requests, and responses, share similar structure and are composed of:

1. A start-line describing the requests to be implemented, or its status of whether

successful or a failure. This start-line is always a single line.
2. An optional set of HTTP headers specifying the request, or describing the body included
in the message.
3. A blank line indicating all meta-information for the request has been sent.
4. An optional body containing data associated with the request (like content of an HTML
form), or the document associated with a response. The presence of the body and its
size is specified by the start-line and HTTP headers.

The start-line and HTTP headers of the HTTP message are collectively known as the head of the
requests, whereas its payload is known as the body.
HTTP Requests

Start line

HTTP requests are messages sent by the client to initiate an action on the server. Their start-
line contain three elements:

1. An HTTP method, a verb (like GET, PUT or POST) or a noun (like HEAD or OPTIONS), that
describes the action to be performed. For example, GET indicates that a resource should
be fetched or POST means that data is pushed to the server (creating or modifying a
resource, or generating a temporary document to send back).
2. The request target, usually a URL, or the absolute path of the protocol, port, and domain
are usually characterized by the request context. The format of this request target varies
between different HTTP methods. It can be
○ An absolute path, ultimately followed by a '?' and query string. This is the most
common form, known as the origin form, and is used with GET, POST, HEAD, and
OPTIONS methods.
■ POST / HTTP/1.1
■ GET /background.png HTTP/1.0
■ HEAD /test.html?query=alibaba HTTP/1.1
■ OPTIONS /anypage.html HTTP/1.0
○ A complete URL, known as the absolute form, is mostly used with GET when
connected to a proxy. GET https://developer.mozilla.org/en-
US/docs/Web/HTTP/Messages HTTP/1.1
○ The authority component of a URL, consisting of the domain name and optionally
 the port (prefixed by a ':'), is called the authority form. It is only used with
CONNECT when setting up an HTTP tunnel. CONNECT developer.mozilla.org:80
HTTP/1.1
○ The asterisk form, a simple asterisk ('*') is used with OPTIONS, representing the
server as a whole. OPTIONS * HTTP/1.1
3. The HTTP version, which defines the structure of the remaining message, acting as an
indicator of the expected version to use for the response.

Headers

HTTP headers from a request follow the same basic structure of an HTTP header: a case-
insensitive string followed by a colon (':') and a value whose structure depends upon the header.
The whole header, including the value, consists of one single line, which can be quite long.

Many different headers can appear in requests. They can be divided in several groups:

● General headers, like Via, apply to the message as a whole.

● Request headers, like User-Agent or Accept, modify the request by specifying it further
(like Accept-Language), by giving context (like Referer), or by conditionally restricting it
(like If-None).
● Representation headers like Content-Type that describe the original format of the
message data and any encoding applied (only present if the message has a body).

Body

The final part of the request is its body. Not all requests have one: requests fetching resources,
like GET, HEAD, DELETE, or OPTIONS, usually don't need one. Some requests send data to the
server in order to update it: as often the case with POST requests (containing HTML form data).
Bodies can be broadly divided into two categories:

● Single-resource bodies, consisting of one single file, defined by the two headers: Content
-Type and Content-Length.
● Multiple-resource bodies, consisting of a multipart body, each containing a different bit
of information. This is typically associated with HTML Forms.

HTTP Responses

Status line

The start line of an HTTP response, called the status line, contains the following information:

1. The protocol version, usually HTTP/1.1.

2. A status code, indicating success or failure of the request. Common status codes are
200, 404, or 302
3. A status text. A brief, purely informational, textual description of the status code to help
a human understand the HTTP message.

HTTP response status codes indicate whether a specific HTTP request has been successfully
completed. Responses are grouped in five classes:

1. Informational responses (100 – 199)

2. Successful responses (200 – 299)
3. Redirection messages (300 – 399)
4. Client error responses (400 – 499)
5. Server error responses (500 – 599)

A typical status line looks like: HTTP/1.1 404 Not Found.

Headers

HTTP headers for responses follow the same structure as any other header: a case-insensitive
string followed by a colon (':') and a value whose structure depends upon the type of the header.
The whole header, including its value, presents as a single line.

Many different headers can appear in responses. These can be divided into several groups:
 ● General headers, like Via, apply to the whole message.
● Response headers, like Vary and Accept-Ranges, give additional information about the
server which doesn't fit in the status line.
● Representation headers like Content-Type that describe the original format of the
message data and any encoding applied (only present if the message has a body).

Body

The last part of a response is the body. Not all responses have one: responses with a status
code that sufficiently answers the request without the need for corresponding payload (like 201
Created or 204 No Content) usually don't.