從輸入網址到頁面呈現的詳細過程

面試題經典題目，簡要回答以下：

a.域名解析

b.發起TCP鏈接的三次握手

c.創建TCP鏈接後發起http請求

d.服務端響應http請求，返回響應報文

e.瀏覽器頁面渲染

f.斷開TCP鏈接

 

下面詳細介紹：

a.域名解析

DNS解析，當在瀏覽器中輸入一個URL，如「www.baidu.com」時，這個地址並非百度網站真正意義的地址。每一臺連上網計算機都有一個惟一標識即它的IP地址，DNS解析就將輸入的網址解析成IP地址。

DNS解析是一個遞歸查詢的過程，例如要解析「www.baidu.com」時，過程以下：

在本地域名服務器中查詢IP地址，未找到域名；

本地域名服務器會向根域名服務器發送請求，未找到域名；

本地域名服務器向.com頂級域名服務器發送請求，未找到域名；

本地域名服務器向.baidu.com域名服務器發送請求，找到該域名，將相應的IP返回給本地域名服務器；

 

b.發起TCP鏈接的三次握手

HTTP協議是使用TCP協議做爲其傳輸層協議的，在拿到服務器的IP地址後，客戶端瀏覽器會與服務器創建TCP鏈接，該過程包括三次握手：

第一次握手：創建鏈接時，客戶端向服務端發送請求報文（SYN）

第二次握手：服務器收到請求報文後，如贊成鏈接，則向客戶端發送確認報文（SYN/ACK）

第三次握手：客戶端收到服務器的確認後，再次向服務器發送確認報文，完成鏈接（ACK）

三次握手主要是爲了防止已經失效的請求報文字段發送給服務器，浪費資源。

 

c.創建TCP鏈接後瀏覽器發起HTTP請求

瀏覽器構建HTTP請求報文，並經過TCP協議傳送到服務器的指定端口。HTTP請求報文一共有三個部分：

　　報文首部（請求行+各類首部字段+其餘）

　　空行（它的做用是經過一個空行，告訴服務器請求頭部到此爲止。）

　　報文主體（應被髮送的數據）一般並不必定要有報文主體

下面對百度首頁的請求報文首部進行分析：

請求行

請求方法GET 請求URI /   HTTP協議版本 1.1
GET / HTTP/1.1    

首部字段（請求頭）

請求資源所在服務器
Host: www.baidu.com
鏈接方式：持久鏈接     HTTP/1.1以前版本默認非持久鏈接
Connection: keep-alive
報文指令：要求全部中間服務器不返回緩存資源
Pragma: no-cache
控制緩存的行爲：緩存前必須先確認其有效性，防止從緩存中返回過時的資源
Cache-Control: no-cache
用戶代理可處理的媒體類型
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8   q表示權重從而區分優先級
http客戶端瀏覽器信息
User-Agent: Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36
可接受的內容編碼類型
Accept-Encoding: gzip, deflate, sdch
可接受的語言
Accept-Language: zh-CN,zh;q=0.8
相關信息或標記
Cookie: BAIDUID=3C67AA3EF6B3347D3AA986CE489268C4:FG=1; BIDUPSID=3C67AA3EF6B3347D3AA986CE489268C4;

常見的請求頭字段含義：

Accept： 瀏覽器可接受的MIME類型。

Accept-Charset：瀏覽器可接受的字符集。

Accept-Encoding：瀏覽器可以進行解碼的數據編碼方式，好比gzip。Servlet可以向支持gzip的瀏覽器返回經gzip編碼的HTML頁面。許多情形下這能夠減小5到10倍的下載時間。

Accept-Language：瀏覽器所但願的語言種類，當服務器可以提供一種以上的語言版本時要用到。

Authorization：受權信息，一般出如今對服務器發送的WWW-Authenticate頭的應答中。

Content-Length：表示請求消息正文的長度。

Host： 客戶機經過這個頭告訴服務器，想訪問的主機名。Host頭域指定請求資源的Intenet主機和端口號，必須表示請求url的原始服務器或網關的位置。HTTP/1.1請求必須包含主機頭域，不然系統會以400狀態碼返回。

If-Modified-Since：客戶機經過這個頭告訴服務器，資源的緩存時間。只有當所請求的內容在指定的時間後又通過修改才返回它，不然返回304「Not Modified」應答。

Referer：客戶機經過這個頭告訴服務器，它是從哪一個資源來訪問服務器的(防盜鏈)。包含一個URL，用戶從該URL表明的頁面出發訪問當前請求的頁面。

User-Agent：User-Agent頭域的內容包含發出請求的用戶信息。瀏覽器類型，若是Servlet返回的內容與瀏覽器類型有關則該值很是有用。

Cookie：客戶機經過這個頭能夠向服務器帶數據，這是最重要的請求頭信息之一。

Pragma：指定「no-cache」值表示服務器必須返回一個刷新後的文檔，即便它是代理服務器並且已經有了頁面的本地拷貝。

From：請求發送者的email地址，由一些特殊的Web客戶程序使用，瀏覽器不會用到它。

Connection：處理完此次請求後是否斷開鏈接仍是繼續保持鏈接。若是Servlet看到這裏的值爲「Keep- Alive」，或者看到請求使用的是HTTP 1.1(HTTP 1.1默認進行持久鏈接)，它就能夠利用持久鏈接的優勢，當頁面包含多個元素時(例如Applet，圖片)，顯著地減小下載所須要的時間。要實現這一點，Servlet須要在應答中發送一個Content-Length頭，最簡單的實現方法是：先把內容寫入 ByteArrayOutputStream，而後在正式寫出內容以前計算它的大小。

Range：Range頭域能夠請求實體的一個或者多個子範圍。例如，

表示頭500個字節：bytes=0-499

表示第二個500字節：bytes=500-999

表示最後500個字節：bytes=-500

表示500字節之後的範圍：bytes=500-

第一個和最後一個字節：bytes=0-0,-1

同時指定幾個範圍：bytes=500-600,601-999

可是服務器能夠忽略此請求頭，若是無條件GET包含Range請求頭，響應會以狀態碼206(PartialContent)返回而不是以200 (OK)。

UA-Pixels，UA-Color，UA-OS，UA-CPU：由某些版本的IE瀏覽器所發送的非標準的請求頭，表示屏幕大小、顏色深度、操做系統和CPU類型。

HTTP請求報文格式以下

 

 

d.服務端響應http請求，返回響應報文

HTTP響應報文由四部分組成：響應行、響應頭、空行、響應體

 

響應行

響應行通常由協議版本、狀態碼及其描述組成，好比

HTTP/1.1 200 OK

常見狀態碼

100~199：表示成功接收請求，要求客戶端繼續提交下一次請求才能完成完整的處理過程

200~299：表示成功接收請求並處理完成。經常使用200

300~399:爲完成請求，客戶需進一步細化請求，例如：請求的資源轉移到一個新地址、經常使用302（轉移請求），304和307（請求緩存）

400~499：客戶端的請求有錯誤，經常使用404（web服務器中沒有要請求的資源）和403（權限不夠、服務器拒絕訪問）

500~599：服務器端出現錯誤，經常使用500

 

響應頭

響應頭用於描述服務器的基本信息，以及數據的描述，服務器經過這些數據的描述信息，能夠通知客戶端如何處理等一下子它回送的數據。

常見的響應頭字段含義：

Allow：服務器支持哪些請求方法(如GET、POST等)。

Content-Encoding：文檔的編碼(Encode)方法。只有在解碼以後才能夠獲得Content-Type頭指定的內容類型。利用gzip壓縮文檔可以顯著地減小HTML文檔的下載時間。Java的GZIPOutputStream能夠很方便地進行gzip壓縮，但只有Unix上的Netscape和Windows上的IE四、IE5才支持它。所以，Servlet應該經過查看Accept-Encoding頭(即request.getHeader(「Accept- Encoding」))檢查瀏覽器是否支持gzip，爲支持gzip的瀏覽器返回經gzip壓縮的HTML頁面，爲其餘瀏覽器返回普通頁面。

Content-Length：表示內容長度。只有當瀏覽器使用持久HTTP鏈接時才須要這個數據。若是你想要利用持久鏈接的優點，能夠把輸出文檔寫入 ByteArrayOutputStram，完成後查看其大小，而後把該值放入Content-Length頭，最後經過byteArrayStream.writeTo(response.getOutputStream()發送內容。

Content- Type：表示後面的文檔屬於什麼MIME類型。Servlet默認爲text/plain，但一般須要顯式地指定爲text/html。因爲常常要設置 Content-Type，所以HttpServletResponse提供了一個專用的方法setContentType。

Date：當前的GMT時間，例如，Date:Mon,31Dec200104:25:57GMT。Date描述的時間表示世界標準時，換算成本地時間，須要知道用戶所在的時區。你能夠用setDateHeader來設置這個頭以免轉換時間格式的麻煩。

Expires：告訴瀏覽器把回送的資源緩存多長時間，-1或0則是不緩存。

Last-Modified：文檔的最後改動時間。客戶能夠經過If-Modified-Since請求頭提供一個日期，該請求將被視爲一個條件GET，只有改動時間遲於指定時間的文檔纔會返回，不然返回一個304(Not Modified)狀態。Last-Modified也可用setDateHeader方法來設置。

Location：這個頭配合302狀態碼使用，用於重定向接收者到一個新URI地址。表示客戶應當到哪裏去提取文檔。Location一般不是直接設置的，而是經過HttpServletResponse的sendRedirect方法，該方法同時設置狀態代碼爲302。

Refresh：告訴瀏覽器隔多久刷新一次，以秒計。

Server：服務器經過這個頭告訴瀏覽器服務器的類型。Server響應頭包含處理請求的原始服務器的軟件信息。此域能包含多個產品標識和註釋，產品標識通常按照重要性排序。Servlet通常不設置這個值，而是由Web服務器本身設置。

Set-Cookie：設置和頁面關聯的Cookie。Servlet不該使用response.setHeader(「Set-Cookie」, …)，而是應使用HttpServletResponse提供的專用方法addCookie。

Transfer-Encoding：告訴瀏覽器數據的傳送格式。

WWW-Authenticate：客戶應該在Authorization頭中提供什麼類型的受權信息?在包含401(Unauthorized)狀態行的應答中這個頭是必需的。例如，response.setHeader(「WWW-Authenticate」, 「BASIC realm=\」executives\」「)。注意Servlet通常不進行這方面的處理，而是讓Web服務器的專門機制來控制受密碼保護頁面的訪問。

注：設置應答頭最經常使用的方法是HttpServletResponse的setHeader，該方法有兩個參數，分別表示應答頭的名字和值。和設置狀態代碼類似，設置應答頭應該在發送任何文檔內容以前進行。

setDateHeader方法和setIntHeader方法專門用來設置包含日期和整數值的應答頭，前者避免了把Java時間轉換爲GMT時間字符串的麻煩，後者則避免了把整數轉換爲字符串的麻煩。

HttpServletResponse還提供了許多設置

setContentType：設置Content-Type頭。大多數Servlet都要用到這個方法。

setContentLength：設置Content-Length頭。對於支持持久HTTP鏈接的瀏覽器來講，這個函數是頗有用的。

addCookie：設置一個Cookie(Servlet API中沒有setCookie方法，由於應答每每包含多個Set-Cookie頭)。

響應體

響應體就是響應的消息體，若是是純數據就是返回純數據，若是請求的是HTML頁面，那麼返回的就是HTML代碼，若是是JS就是JS代碼，如此之類。

 

HTTP響應報文格式以下

 

 

e.瀏覽器頁面渲染

　　解析文檔構建DOM樹

　　構建渲染樹

　　佈局和繪製渲染樹

 

f.斷開TCP鏈接

 

　　第一次揮手：客戶端想分手，發送消息（FIN）給服務器

　　第二次揮手：服務器通知客戶端已經接受的揮手請求，返回確認消息（ACK），但還沒作好分手準備

　　第三次揮手：服務器已經作好分手準備，通知客戶端（FIN）

　　第四次揮手：客戶端發送消息給服務器（ACK），確認分手，服務器關閉鏈接。