1. 程式人生 > >從輸入URL到頁面載入完成的過程詳解

從輸入URL到頁面載入完成的過程詳解

時間:2018年3月27日14:03:05

    對於經歷過多次面試的前端工程師來說,這個問題肯定會遇到過,而且每次都回答的不同,因此,把這個問題拿出來單獨討論,不僅對於自己的知識有所積累,同時也有助於廣度的學習。

    用到的技術:瀏覽器技術、http、網路服務等

    比如,我們要訪問:http://www.baidu.com,過程如下:

1、瀏覽器從URL中解析出伺服器主機名(文字形式的域名),www.baidu.com

2、瀏覽器通過 域名伺服器(DNS,domain name system將伺服器的主機名轉換成伺服器的IP地址,119.75.217.109(域名-IP地址,相互對映的儲存在分散式資料庫中);

補充:DNS解析流程

第一步:瀏覽器將會檢查快取中有沒有這個域名對應的解析過的IP地址,如果有,該解析過程將會結束。瀏覽器快取域名也是有限制的,包括快取的時間、大小,可以通過TTL屬性來設定。
第二步:如果使用者的瀏覽器中快取中沒有,作業系統會先檢查自己本地的hosts檔案是否有這個網址對映關係,如果有,就先呼叫這個IP地址對映,完成域名解析。
第三步:如果hosts裡沒有這個域名的對映,則查詢本地DNS解析器快取,是否有這個網址對映關係,如果有,直接返回,完成域名解析。
第四步:如果hosts與本地DNS解析器快取都沒有相應的網址對映關係,首先會找TCP/ip引數中設定的首選DNS伺服器,在此我們叫它本地DNS伺服器,此伺服器收到查詢時,如果要查詢的域名包含在本地配置區域資源中,則返回解析結果給客戶機,完成域名解析,此解析具有權威性。
第五步:如果要查詢的域名不由本地DNS伺服器區域解析,但該伺服器已快取了此網址對映關係,則呼叫這個IP地址對映,完成域名解析,此解析不具有權威性。
第六步:如果本地DNS伺服器、本地區域檔案與快取解析都失效,則根據本地DNS伺服器的設定(是否設定轉發器)進行查詢,如果未用轉發模式,本地DNS就把請求發至13臺根DNS,根DNS伺服器收到請求後會判斷這個域名(.com)是誰來授權管理,並會返回一個負責該頂級域名伺服器的一個IP。本地DNS伺服器收到IP資訊後,將會聯絡負責.com域的這臺伺服器。這臺負責.com域的伺服器收到請求後,如果自己無法解析,它就會找一個管理.com域的下一級DNS伺服器地址給本地DNS伺服器。當本地DNS伺服器收到這個地址後,就會找域名域伺服器,重複上面的動作,進行查詢,直至找到域名對應的主機。
第七步:如果用的是轉發模式,此DNS伺服器就會把請求轉發至上一級DNS伺服器,由上一級伺服器進行解析,上一級伺服器如果不能解析,或找根DNS或把轉請求轉至上上級,以此迴圈。不管是本地DNS伺服器用是是轉發,還是根提示,最後都是把結果返回給本地DNS伺服器,由此DNS伺服器再返回給客戶機。

3、瀏覽器從URL中解析出埠號,預設80

4、瀏覽器建立一條與Web伺服器的TCP連線,瀏覽器發起到119.75.217.109埠80的連線

    TCP,Transmission Control Protocol,傳輸控制協議,將 請求報文 和 響應報文 從一個地方搬移到另一個地方。TCP可以提供的功能,無差錯的資料傳輸、按序傳輸、未分段資料流。

5、通過建立的連線傳送一條請求報文,瀏覽器向伺服器傳送一條HTTP GET請求報文

6、伺服器向瀏覽器回送一條HTTP響應報文

7、瀏覽器關閉連線

8、解析文件

    Web應用程式:Web瀏覽器、Web伺服器、代理、快取、閘道器、隧道、Agent代理

9、頁面渲染的過程出現的問題

    JS阻塞載入:瀏覽器在載入JS的時候會阻塞瀏覽器的DOM渲染