前言
扯一扯從你輸入網(wǎng)址到網(wǎng)頁呈現(xiàn)發(fā)生了什么犁柜。
一. 輸入URL
URL(Uniform Resource Locator)洲鸠，統(tǒng)一資源定位符,它是對可以從互聯(lián)網(wǎng)上得到的資源的位置和訪問方法的一種簡潔的表示，是互聯(lián)網(wǎng)上標(biāo)準(zhǔn)資源的地址馋缅。互聯(lián)網(wǎng)上的每個文件都有一個唯一的URL萤悴，它包含的信息指出文件的位置以及瀏覽器應(yīng)該怎么處理它瘾腰。它也包含協(xié)議部分，是瀏覽器和萬維網(wǎng)之間溝通的方式覆履，常見的協(xié)議有http蹋盆、https、ftp硝全、file····
二 .域名的解析
當(dāng)你輸入http://baidu.com時栖雾，實際上瀏覽器并不知道baidu.com是什么東西，它需要查找baidu.com的所在服務(wù)器的IP地址才能找到目標(biāo)伟众。
1.什么是域名
例如在http://baidu.com中析藕，baidu.com就是該網(wǎng)址的域名。
2.為什么不直接使用IP地址而發(fā)明域名
因為域名比一串?dāng)?shù)字的IP地址更容易記住凳厢，所以使用域名账胧。
3.IP地址是什么
IP地址是指互聯(lián)網(wǎng)協(xié)議地址（Internet Protocol Address）。IP地址是IP協(xié)議提供的一種統(tǒng)一的地址格式先紫，它為互聯(lián)網(wǎng)上的每一個網(wǎng)絡(luò)和每一臺主機分配一個邏輯地址治泥，以此來屏蔽物理地址的差異。
- 每個網(wǎng)絡(luò)上的設(shè)備都有IP地址例如
192.168.0.1遮精。 - 局域網(wǎng)的IP地址和公網(wǎng)的IP地址是有差異的居夹。
-
127.0.0.1代表本機的IP地址。
4.域名解析的流程
- 瀏覽器會自動緩存DNS記錄一段時間，瀏覽器會檢查緩存中有沒有這個域名對應(yīng)的解析過的IP地址吮播，如果有解析過程就此結(jié)束。
- 系統(tǒng)緩存眼俊，從系統(tǒng)Hosts文件中查找是否有該域名和對應(yīng)的IP意狠。
- 路由器緩存，一般路由器也會緩存域名信息疮胖。
- IPS DNS緩存- 比如到電信的DNS 上查找緩存环戈。
- 如果以上方法都沒有找到，則向根域名服務(wù)器查找對應(yīng)的IP地址澎灸，根域名服務(wù)器把請求轉(zhuǎn)發(fā)到下一級院塞，一直到找到IP。
問：當(dāng)電腦上不了網(wǎng)了性昭，為什么修改DNS為
8.8.8.8或者114.114.114.114?
答：
8.8.8.8是谷歌提供的DNS服務(wù)器拦止，跳過上述步驟1-5，直接在谷歌提供的DNS服務(wù)器里查找該域名糜颠。同理114.114.114.114是電信提供的DNS服務(wù)器汹族。
經(jīng)過以上IP尋址的過程，目標(biāo)URL查找到對應(yīng)的IP地址之后其兴，通過IP地址查找到對應(yīng)的服務(wù)器顶瞒，瀏覽器將用戶發(fā)起的http請求發(fā)送給服務(wù)器。下一步就到了服務(wù)器處理階段的工作元旬。
三.服務(wù)器處理
每臺服務(wù)器上都會安裝處理請求的應(yīng)用web server榴徐，常見的web server產(chǎn)品有Apache、Nginx匀归、IIS坑资、Lighttpd····
web server 擔(dān)任管控的角色，對于不同用戶發(fā)送的請求穆端，會結(jié)合配置文件盐茎，把不同請求委托給服務(wù)器上處理對應(yīng)請求的程序進行處理（例如CGI腳本，JSP腳本徙赢，servlets字柠，ASP腳本，Node.js狡赐，或者一些其它的服務(wù)器端技術(shù)等）窑业，然后返回后臺程序處理產(chǎn)生的結(jié)果作為響應(yīng)。
四.網(wǎng)站處理階段
MVC
MVC是一種使用MVC（Model-View-Control 模型-視圖-控制器）設(shè)計創(chuàng)建web程序的模式枕屉。
- Model（模型）模型是將實際開發(fā)中的業(yè)務(wù)規(guī)則和所涉及的數(shù)據(jù)格式模型化常柄，應(yīng)用于模型的代碼只需寫一次就可以被多個視圖重用。在MVC的三個部件中，模型擁有最多的處理任務(wù)西潘。一個模型能為多個視圖提供數(shù)據(jù)卷玉。*
- View（視圖）是應(yīng)用程序中用于處理程序數(shù)據(jù)邏輯部分。
- Control（控制器）控制器接受用戶的輸入并調(diào)用模型和視圖去完成用戶的需求喷市。Controller處于管理角色相种，從視圖接收請求并決定調(diào)用哪個模型構(gòu)件去處理請求，然后再確定用哪個視圖來顯示模型處理返回的數(shù)據(jù)品姓。
總結(jié)而言寝并，首先控制器接收用戶的請求，并決定應(yīng)該調(diào)用哪個模型來進行處理腹备，然后模型用業(yè)務(wù)邏輯來處理用戶的請求并返回數(shù)據(jù)衬潦，最后控制器用相應(yīng)的視圖格式化模型返回html字符串給瀏覽器，瀏覽器呈現(xiàn)網(wǎng)頁給用戶植酥。因此镀岛，下一步就來到瀏覽器處理階段。
瀏覽器處理
HTML字符串被瀏覽器接受后被一句句讀取解析友驮，解析到link 標(biāo)簽后重新發(fā)送請求獲取css哎媚，解析到，script標(biāo)簽后發(fā)送請求獲取 js喊儡，并執(zhí)行代碼拨与，解析到img 標(biāo)簽后發(fā)送請求獲取圖片資源。
加載
瀏覽器對html頁面的加載是自頂向下的艾猜，并在加載的過程中進行解析與渲染买喧。遇到link，image匆赃，script標(biāo)簽時瀏覽器會再次向服務(wù)器發(fā)送請求獲取相應(yīng)的css文件淤毛，圖片文件，js文件算柳，并執(zhí)行js代碼低淡。
解析與渲染
將html文檔解析生成解析樹（DOM樹），這是由DOM元素以及屬性節(jié)點組成瞬项，樹根是document對象蔗蹋。
構(gòu)建渲染樹是DOM樹可視化的表示，目的是為了以正確的順序繪制文檔內(nèi)容囱淋。不可見的DOM元素不會被插入渲染樹中（例如display:none;）,還有像一些節(jié)點的位置為絕對或浮動定位猪杭，這些節(jié)點會在文本流之外，因此會在兩棵樹上的不同位置妥衣，渲染樹標(biāo)識出真實的位置皂吮，并用一個占位結(jié)構(gòu)標(biāo)識出他們原來的位置戒傻。
六. 繪制網(wǎng)站
瀏覽器根據(jù)渲染樹繪制網(wǎng)站并最終展現(xiàn)在瀏覽器上。
