Why input url You can show the corresponding page ？ What happened behind it ？

The overall process is as follows

• DNS analysis ： Resolve the domain name to Ip Address
• tcp Connect ： tcp Three handshakes
• send out http request
• The server processes the request and returns http message
• Browser parse render page
• disconnect ：tcp Four waves

One 、DNS Domain name resolution

Enter the web address in the browser （URL） after , First, through domain name resolution , Because the browser can only pass through IP Address to find the corresponding server , You entered a domain name , Then it needs to be resolved into IP Address .

DNS The agreement is to search through the domain name IP Address , Or reverse passage IP Address search domain name service .
DNS It's a web server （ Domain name server ）, Our domain name resolution is simply in DNS Record an information record on the server

Two 、 establish TCP Connect （ Three handshakes ）

It will be initiated before the client sends data TCP Three handshakes are used to synchronize the serial numbers of the client and server , And exchange TCP Window size information .

• The first handshake , Browser initiated , Inform server , I'm going to send a request （ The browser sends a message with SYN=1,Seq=x Of packets to the server ）
• The second handshake , Initiated by the server , Tell the browser , I'm ready to accept , You send it （ The server sends back a tape SYN=1,ACK= X+1,Seq=Y Response package to convey the confirmation message ）
• The third handshake , Browser initiated , Inform server , I'm going to send it soon , You're ready to receive （ The browser returns another tape ACK=Y+1,Seq=Z）

The connection can be established twice , Why do I need three handshakes ？
In order to prevent the invalid connection request message segment from suddenly transferring to the server , So there's a mistake

Consider a situation like this ,“ Invalid connection request message segment ” In such a case ：client The first connection request segment sent is not lost , But in a network node for a long time , So that it will not arrive until some time after the connection is released server. Originally, this is a message segment that has already failed . but server After receiving this invalid connection request message segment , I mistook it for client A new connection request issued again . So I went to client Send confirmation message segment , Agree to establish a connection . Suppose you don't use “ Three handshakes ”, So as long as server Send a confirmation , A new connection is established . Because now client No connection request was made , So I won't pay any attention to server The confirmation of , Nor to server send data . but server But think that a new transport connection has been established , And kept waiting client Send data . such ,server A lot of resources are wasted . use “ Three handshakes ” The method can prevent the above phenomenon . For example, the situation just now ,client No direction server To send out a confirmation .server Because no confirmation can be received , You know client No connection required .”. The main purpose is to prevent server End has been waiting for , Waste resources .

3、 ... and 、 send out HTTP request

TCP After three handshakes to establish a connection , Start sending HTTP Request message .
 The request message is sent by the request line （request line）、 Request header （header）、 The request body consists of three parts 

Four 、 The server processes the request and returns HTTP message

For requests sent by different users , Will be combined with the configuration file , Delegate different requests to the program on the server that processes the corresponding requests （ for example CGI Script ,JSP Script ,servlets,ASP Script , Server side JavaScript, Or some other server-side technology ）, Then return the result produced by the background program processing as the response information .

The response information will be returned to the client in the form of response message , Finally, the browser presents the web page to the user through the rendering engine

Response message from response line （request line）、 Response head （header）、 The response body consists of three parts

5、 ... and 、 The browser gets the response data （HTML） after , Start processing rendered pages

There are five steps for the browser to parse and render the page ：

• according to HTML It is concluded that DOM Trees
• according to CSS Parse generation CSS The rule tree
• combination DOM Trees and CSS The rule tree , Generate render tree
• Calculate the information of each node according to the rendering tree
• Draw the page according to the calculated information

6、 ... and 、 disconnect

• First wave ： Initiated by the browser , Send to the server , I have sent the request message , You're going to close it （ The initiator sends a message to the passive party ,Fin、Ack、Seq, No data transmission . And enter FIN_WAIT_1 state ）
• Second wave ： Initiated by the server , Tell the browser , I have finished accepting the request message , I'm ready to close , You're ready to （ Passive party sends message ,Ack、Seq, Consent to close request . At this time, the initiator of the host enters FIN_WAIT_2 state .）
• Third wave ： Initiated by the server , Tell the browser , I sent the response message , You're going to close it （ Send message segments to initiators passively ,Fin、Ack、Seq, Request close connection . And enter LAST_ACK state .）
• Fourth wave ： Browser initiated , Tell the server , I have received the response message , I'm ready to close , You're ready to （ The initiator sends the message segment to the passive party ,Ack、Seq. Then enter the waiting TIME_WAIT state . The passive party closes the connection after receiving the message segment of the initiator . The initiator waits for a certain time without receiving a reply , Then close normally .）