瀏覽器輸入網址到顯示在頁面發生全過程

通過dns域名解析ip

瀏覽器優先在hosts文件中查找,沒有會遞歸查詢也就是瀏覽器只跟本地域名服務器請求ip地址;
本地域名服務器沒有,本地域名服務器自己會執行迭代查詢,
優先到跟域名服務器下,根域名服務器不負責解析但是會告知可解析該域名的頂級域名服務器(.com)地址返回給本地域名服務器,
本地域名服務器再去對應地址下查找,對應地址下的服務器下無法解析會再告知本地域名服務器可以解析的二級域名(baidu.com)的地址,
本地域名服務器再去對應二級域名服務器下解析,一層一層向下迭代之後可解析ip返回給本地域名服務器。
本地域名服務器拿到後會將ip返給瀏覽器並緩存到本地供下次查詢使用

瀏覽器根據ip建立tcp連接(三次握手)

通過三次握手連接服務器指定端口,同步連接雙方的序列號和確認序號
瀏覽器發送請求包給服務端,將SYN標誌位設爲1,併發送自己的序列號seq=x給客戶端
客戶端接收到請求包後發送確認請求包給客戶端,將請求標誌位SYN設爲1,確認標誌位ACK設爲1,自己的序列編號設爲seq=y,以及確認序列編號ACKnum設爲x+1
客戶端發送確認包給服務端,確認標誌位ACK設爲1,確認編號序列ACKnum設爲y+1
連接完成

不是兩次是因爲產生丟包後服務端在接受到這個請求包之後對其進行響應但不是現在對應的請求包序列,客戶端不會對其響應,服務器一直處於等待狀態,資源浪費
三次就夠,四次就浪費資源了

在瀏覽器發送請求後需要優先檢查本地是否有緩存

瀏覽器會去查看是否有緩存:
1、沒有緩存
直接發送請求給服務器,在接收到服務器響應資源後記錄狀態碼200對其解析並將其存入緩存,緩存標識添加max-age、if-modified-since、if-none-match
(請求頭中的if-modified-since、if-none-match與響應頭中的last-modified、etag對應,沒過期的話他們的內容值應該是一樣的)
2、有緩存:就判斷緩存
優先根據cache-control的max-age(允許讀取緩存的時間)和expires(緩存過期時間)來檢測緩存是否過期,如果沒有過期就直接讀取緩存,過期的話發送請求到服務器,並在請求頭中添加if-none-match以及if-modified-since;
服務器在接收到該請求後會將其與etag以及last-modified進行對比,驗證請求資源是否更新,如果沒有過期,返回304 繼續使用該緩存,如果真的過期,服務器發送響應資源給客戶端狀態碼顯示爲200,客戶端接收到後對該資源進行緩存並解析。

建立連接後瀏覽器通過發送HTTP請求至服務器

五層模型傳輸單位

物理層:比特
數據鏈路層:幀
網絡層:分組
運輸層:報文段
應用層:報文
請求報文中包含(請求方法/URI/協議版本號)請求行 + 請求頭 + 空行 + 請求內容

GET/sample.jspHTTP/1.1                    //請求方法/URI/協議版本號
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            //請求內容

 

服務器接收請求並返回HTTP響應報文給客戶端,返回請求資源

響應報文中包含(協議版本號/響應狀態碼/狀態碼說明)狀態行 + 響應頭 + 空行 + 響應正文

HTTP/1.1 200 OK
Server:Apache Tomcat/5.0.12
Date:Mon,6Oct2003 13:23:42 GMT
Content-Length:112

響應正文

瀏覽器接收到資源並檢測響應狀態碼,200開始解析頁面

將字節數據轉化爲標記再轉成node再轉成相應的dom以及cssom樹

兩者渲染成一顆render樹,只渲染可見的dom

根據render樹佈局,計算每個節點位置,重繪和迴流

調用GPU(圖形處理器,渲染必須),形成圖層(每個新屬性形成一個新的圖層,提高可修改性),所有圖層疊加後顯示在頁面上

瀏覽器完成渲染,請求響應結束,斷開tcp連接(四次揮手)

客戶端發送斷開請求包給服務端,斷開標誌位FIN置爲1,發送序號編號seq=x
服務端接收到後發送確認包給客戶端,將確認標誌位ACK設爲1,確認客戶端序號編號seq=x+1,發送自己的當前序號編號seq=y,此過程中可以能還在繼續發送資源給瀏覽器,等到發送全部完成纔會完全確認斷開
服務端返回所有資源,發送斷開確認包給客戶端,斷開標誌位FIN置爲1,確認標誌位ACK=1,確認客戶端序號編號ACKnum爲x+1,發送自己最終序號編號seq=u
客戶端接收後發送確認包給服務器端,確認標誌位ACK爲1,確認客戶端序號編號ACKnum=u+1,序號編號seq置爲x+1
2MSL(報文最大存活時間)後,斷開連接
等待2msl後才斷開連接,確保最終發送的確認報文服務器端可以接收到

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章