瀏覽器輸入URL到響應頁面的全過程

OldBoy~發表於2017-09-20

B/S網路架構從前端到後端都得到了簡化,都基於統一的應用層協議HTTP來互動資料,HTTP協議採用無狀態的短連結的通訊方式,通常情況下,一次請求就完成了一次資料互動,通常也對應一個業務邏輯,然後這次通訊連線就斷開了。採用這種方式是為了能夠同時服務更多的使用者,因為當前網際網路應用每天都會處理上億的使用者請求,不可能每個使用者訪問一次後就一直保持住這個連線。

①輸入URL:www.google.com;

②DNS域名解析:域名與IP對映(傳送到DNS(域名伺服器)獲得域名對應的WEB伺服器的IP地址);

③建立TCP連線: 客戶端瀏覽器與WEB伺服器建立TCP(傳輸控制協議)連線,三次握手;

④傳送Http Request:請求資訊(客戶端瀏覽器向對應IP地址的WEB伺服器傳送相應的HTTP或HTTPS請求);

⑤WEB伺服器:Nginx反向代理(客戶端本來可以直接通過HTTP協議訪問某網站應用伺服器,網站管理員可以在中間加上一個Nginx,客戶端請求Nginx,Nginx請求應用伺服器,然後將結果返回給客戶端,此時Nginx就是反向代理伺服器);

⑥應用伺服器:Server處理請求(資料庫等互動.....);

⑦使用者瀏覽器:渲染響應頁面(客戶端瀏覽器下載資料,解析HTML原始檔,解析的過程中實現對頁面的排版,解析完成後,在瀏覽器中顯示基礎的頁面);

⑧關閉TCP連線:響應完成(非持久連線);

一句話概括:瀏覽器本身是一個客戶端,當你輸入URL的時候,首先瀏覽器會去請求DNS伺服器,通過DNS獲取相應的域名對應的IP,然後通過IP地址找到IP對應的伺服器後,要求建立TCP連線,等瀏覽器傳送完HTTP Request(請求)包後,伺服器接收到請求包之後才開始處理請求包,伺服器呼叫自身服務,返回HTTP Response(響應)包;客戶端收到來自伺服器的響應後開始渲染這個Response包裡的主體(body),等收到全部的內容隨後斷開與該伺服器之間的TCP連線;

 一些具體詳細的補充:

瀏覽器是怎麼查詢域名對應的IP地址的?

1) 請求一旦發起,瀏覽器首先要做的事情就是解析這個域名,一般來說,瀏覽器會首先檢視本地硬碟的 hosts 檔案,看看其中有沒有和這個域名對應的規則,如果有的話就直接使用 hosts 檔案裡面的 ip 地址。
2) 如果在本地的 hosts 檔案沒有能夠找到對應的 ip 地址,瀏覽器會發出一個 DNS請求到本地DNS伺服器 。本地DNS伺服器一般都是你的網路接入伺服器商提供,比如中國電信,中國移動。
3) 查詢你輸入的網址的DNS請求到達本地DNS伺服器之後,本地DNS伺服器會首先查詢它的快取記錄,如果快取中有此條記錄,就可以直接返回結果,此過程是遞迴的方式進行查詢。如果沒有,本地DNS伺服器還要向DNS根伺服器進行查詢。
4) 根DNS伺服器沒有記錄具體的域名和IP地址的對應關係,而是告訴本地DNS伺服器,你可以到域伺服器上去繼續查詢,並給出域伺服器的地址。
5) 本地DNS伺服器繼續向域伺服器發出請求,在這個例子中,請求的物件是.com域伺服器。.com域伺服器收到請求之後,也不會直接返回域名和IP地址的對應關係,而是告訴本地DNS伺服器,你的域名的解析伺服器的地址。
6) 最後,本地DNS伺服器向域名的解析伺服器發出請求,這時就能收到一個域名和IP地址對應關係,本地DNS伺服器不僅要把IP地址返回給使用者電腦,還要把這個對應關係儲存在快取中,以備下次別的使用者查詢時,可以直接返回結果,加快網路訪問。

瀏覽器向 web 伺服器傳送一個 HTTP 請求的過程大概是?

拿到域名對應的IP地址之後,瀏覽器會以一個隨機埠(1024<埠<65535)向伺服器的WEB程式(常用的有httpd,nginx等)80埠發起TCP的連線請求。這個連線請求到達伺服器端後(這中間通過各種路由裝置,區域網內除外),進入到網路卡,然後是進入到核心的TCP/IP協議棧(用於識別該連線請求,解封包,一層一層的剝開),還有可能要經過Netfilter防火牆(屬於核心的模組)的過濾,最終到達WEB程式,最終建立了TCP/IP的連線。
建立了TCP連線之後,發起一個http請求。一個典型的 http request header 一般需要包括請求的方法,例如 GET 或者 POST 等,不常用的還有 PUT 和 DELETE 、HEAD、OPTION以及 TRACE 方法,一般的瀏覽器只能發起 GET 或者 POST 請求。

客戶端向伺服器發起http請求的時候,會有一些請求資訊,請求資訊包含三個部分:
-------請求方法URI協議/版本
-------請求頭(Request Header)
-------請求正文:

GET/sample.php
HTTP/1.1 Accept:image/gif.image/jpeg,*/*
Accept-Language:zh-cn
Connection:Keep-Alive
Host:localhost
User-Agent:Mozila/4.0(compatible;MSIE5.01;Window NT5.0)
Accept-Encoding:gzip,deflate

username=jinqiao&password=1234
注意:最後一個請求頭之後是一個空行,傳送回車符和換行符,通知伺服器以下不再有請求頭。

伺服器是如何處理請求的呢?

後端從在固定的埠接收到TCP報文開始,它會對TCP連線進行處理,對HTTP協議進行解析,並按照報文格式進一步封裝成HTTP Request物件,供上層使用。
一些大一點的網站會將你的請求到反向代理伺服器中,因為當網站訪問量非常大,網站越來越慢,一臺伺服器已經不夠用了。於是將同一個應用部署在多臺伺服器上,將大量使用者的請求分配給多臺機器處理。此時,客戶端不是直接通過HTTP協議訪問某網站應用伺服器,而是先請求到Nginx,Nginx再請求應用伺服器,然後將結果返回給客戶端,這裡Nginx的作用是反向代理伺服器。同時也帶來了一個好處,其中一臺伺服器萬一掛了,只要還有其他伺服器正常執行,就不會影響使用者使用。
通過Nginx的反向代理,我們到達了web伺服器,服務端指令碼處理我們的請求,訪問我們的資料庫,獲取需要獲取的內容。

伺服器返回一個 HTTP 響應大概包括哪些?

HTTP響應與HTTP請求相似,HTTP響應也由3個部分構成,分別是:
----- 狀態行
----- 響應頭(Response Header)
----- 響應正文

HTTP/1.1 200 OK 
Date: Sat, 31 Dec 2005 23:59:59 GMT 
Content-Type: text/html;charset=ISO-8859-1 Content-Length: 122 
<html> 
<head> 
<title>http</title> 
</head> 
<body> 
<!-- body goes here --> 
</body> 
</html>

相關文章