瀏覽器從輸入url到頁面呈現發生了什嗎？

標籤：書籍   成功   chrome瀏覽器   需要   網路   沒有   tcp   text   視窗   

當瀏覽器地址欄中輸入www.baidu.com到頁面呈現的具體過程：

1.網域名稱解析(DNS解析)(網路層)

先從緩衝中找網域名稱對應的ip地址，沒有再向網域名稱伺服器發送請求。

-->瀏覽器的DNS緩衝（以Chrome瀏覽器為例查看dns緩衝，在地址欄中輸入chrome://net-internals/#dns 查看瀏覽器內的dns緩衝。）

-->作業系統的DNS緩衝（window系統調出cmd視窗，在視窗處輸入命令ipconfig /displaydns 來進行查看系統內的dns緩衝.)

-->作業系統的hosts檔案（C:\Windows\System32\drivers\etc\hosts）

-->作業系統向LDNS(本地區名伺服器）發送請求(80%成功率)

-->沒有找到則迭代DNS網域名稱解析(網域名稱是從右往左分級的)

• LDNS向根網域名稱伺服器發起請求，請求到.com頂級網域名稱伺服器的地址
• LDNS向(.com)域的頂級網域名稱伺服器發起請求，請求到.baidu.com網域名稱伺服器的地址
• LDNS向(.baidu.com)域的頂級網域名稱伺服器發起請求，請求到www.baidu.com網域名稱對應的ip
• LDNS把得到的ip地址返回給主機作業系統，作業系統緩衝把網域名稱和對應的ip緩衝起來， 作業系統再把ip返回給瀏覽器，瀏覽器也緩衝起來。

2.建立TCP連結(傳輸層)

  瀏覽器要通過http或https協議向伺服器發送請求，就需要先建立與伺服器的連結。用戶端基於TCP協議與ip對應伺服器建立連結。(三向交握機制)

3.瀏覽器發送http請求產生html頁面(應用程式層)

　　以下為大概的渲染過程，具體的資源檔載入順序下一篇再講述

• HTML代碼轉化為DOM(DOM Tree）
• CSS代碼轉化成CSSOM（CSS Object Model）
• 結合DOM和CSSOM，產生一棵渲染樹（包含每個節點的視覺資訊）(Render Tree)
• 產生布局（layout），即將所有渲染樹的所有節點進行平面合成
• 將布局繪製（paint）在螢幕上

4.用戶端與伺服器取消連結

　用戶端通過四次揮手與伺服器取消連結(四次揮手機制)

以上只是簡單的敘述流程，沒有展開講解每一步的細節知識與原理，大家可以自己查詢有關的書籍。

十年磨一劍，霜刃未曾試。今日把示君，誰有不平事？

瀏覽器從輸入url到頁面呈現發生了什嗎？