1.解析URL
________________________________________________________________________
關於URL:
URL(Universal Resource Locator):統一資源定位符。俗稱網頁地址或者網址。
URL用來表示某個資源的地址。(通過俗稱就能看出來)
URL主要由以下幾個部分組成:
a.傳輸協議
b.服務器
c.域名
d.端口
e.虛擬目錄
f.文件名
g.錨
h.參數
也就是說,通常一個URL是像下面這樣
連起來就是:http://www.aspxfans.com:8080/news/index.asp?boardID=5&ID=24618&page=1#name
上面的鏈接有幾個要注意的地方:“;” 和“/”的使用,80端口默認不顯示,“?” 到“#”之間跟着參數,多個參數使用“&”連接,“#”后面跟着錨。
___________________________________________________________________________________________________________________________________________________________________
現在來討論URL解析,當在瀏覽器中輸入URL后,瀏覽器首先對拿到的URL進行識別,抽取出域名字段。
2. DNS解析
DNS解析(域名解析),DNS實際上是一個域名和IP對應的數據庫。
IP地址往都難以記住,但機器間互相只認IP地址,於是人們發明了域名,讓域名與IP地址之間一一對應,它們之間的轉換工作稱為域名解析,域名解析需要由專門的域名解析服務器來完成,整個過程是自動進行的。
可以在瀏覽器中輸入IP地址瀏覽網站,也可以輸入域名查詢網站,雖然得出的內容是一樣的但是調用的過程不一樣,輸入IP地址是直接從主機上調用內容,輸入域名是通過域名解析服務器指向對應的主機的IP地址,再從主機調用網站的內容。
在進行DNS解析時,會經歷以下步驟:
查詢瀏覽器緩存(瀏覽器會緩存之前拿到的DNS 2-30分鍾時間),如果沒有找到,
檢查系統緩存,檢查hosts文件,這個文件保存了一些以前訪問過的網站的域名和IP的數據。它就像是一個本地的數據庫。如果找到就可以直接獲取目標主機的IP地址了。沒有找到的話,需要
檢查路由器緩存,路由器有自己的DNS緩存,可能就包括了這在查詢的內容;如果沒有,要
查詢ISP DNS 緩存:ISP服務商DNS緩存(本地服務器緩存)那里可能有相關的內容,如果還不行的話,需要,
遞歸查詢:從根域名服務器到頂級域名服務器再到極限域名服務器依次搜索哦對應目標域名的IP。
通過以上的查找,就可以獲取到域名對應的IP了。接下來就是向該IP地址定位的HTTP服務器發起TCP連接。
3. 瀏覽器與網站建立TCP連接(三次握手)
第一次握手:客戶端向服務器端發送請求(SYN=1) 等待服務器確認;
第二次握手:服務器收到請求並確認,回復一個指令(SYN=1,ACK=1);
第三次握手:客戶端收到服務器的回復指令並返回確認(ACK=1)。
通過三次握手,建立了客戶端和服務器之間的連接,現在可以請求和傳輸數據了。
4.請求和傳輸數據
比如要通過get請求訪問“http://www.dydh.org/”,通過抓包可以看到:
請求網址(url):http://www.dydh.org/
請求方法:GET
遠程地址:IP
狀態碼:200 OK
Http版本: HTTP/1.1
請求頭: ...
響應頭: ...
注意響應頭中有一個:Set-Cookie:"PHPSESSID=c882giens9f7d3oglcakhrl994; path=/",說明瀏覽器中沒有關於這個網站的cookie信息。
當我們下一次訪問相同的網站時:
可以看到,請求頭中包含了這個cookie信息,
Cookie:"PHPSESSID=c882giens9f7d3oglcakhrl994; CNZZDATA1253283365=1870471808-1473694656-%7C1473694656"
cookie可以用來保存一些有用的信息:Cookies如果是首次訪問,會提示服務器建立用戶緩存信息,如果不是,可以利用Cookies對應鍵值,找到相應緩存,緩存里面存放着用戶名,密碼和一些用戶設置項。
通過這種GET請求,和服務器的響應。可以將服務器上的目標文件傳輸到瀏覽器進行渲染。
5.瀏覽器渲染頁面
客戶端拿到服務器端傳輸來的文件,找到HTML和MIME文件,通過MIME文件,瀏覽器知道要用頁面渲染引擎來處理HTML文件。
a.瀏覽器會解析html源碼,然后創建一個 DOM樹。
在DOM樹中,每一個HTML標簽都有一個對應的節點,並且每一個文本也都會有一個對應的文本節點。
b.瀏覽器解析CSS代碼,計算出最終的樣式數據,形成css對象模型CSSOM。
首先會忽略非法的CSS代碼,之后按照瀏覽器默認設置——用戶設置——外鏈樣式——內聯樣式——HTML中的style樣式順序進行渲染。
c.利用DOM和CSSOM構建一個渲染樹(rendering tree)。
渲染樹和DOM樹有點像,但是是有區別的。
DOM樹完全和html標簽一一對應,但是渲染樹會忽略掉不需要渲染的元素,比如head、display:none的元素等。
而且一大段文本中的每一個行在渲染樹中都是獨立的一個節點。
渲染樹中的每一個節點都存儲有對應的css屬性。
d.瀏覽器就根據渲染樹直接把頁面繪制到屏幕上。
————————————————————————————————————————————————————————————————————————————————————
參考鏈接:
https://www.zhihu.com/question/34873227
http://blog.csdn.net/qq991029781/article/details/50938475
http://blog.csdn.net/lihongxun945/article/details/37830667
http://www.myexception.cn/go/1860953.html
http://www.nowcoder.com/discuss/3853?pos=264&type=1&order=0
http://www.cnblogs.com/xiaohuochai/p/4750444.html
http://baike.so.com/doc/1578352-1668460.html
http://www.cnblogs.com/simonbaker/p/4253832.html