在瀏覽器地址欄輸入U(xiǎn)RL到頁(yè)面展示在用戶面前的這個(gè)過程大致有以下幾個(gè)階段
- 域名解析（找到該網(wǎng)站的服務(wù)器ip是什么）
- 服務(wù)器處理（從該服務(wù)器中找到域名的網(wǎng)站）
- 網(wǎng)站處理（從網(wǎng)站中找到該域名對(duì)應(yīng)的各種html，css，js文件）
- 瀏覽器處理與繪制（把文件返回用戶瀏覽器隙轻，頁(yè)面呈現(xiàn)）
URL是什么
URL(Uniform-Resource-Locator),中文名叫統(tǒng)一資源定位符始绍，用于定位互聯(lián)網(wǎng)上的資源趁耗。
基本的url有協(xié)議、域名疆虚、端口號(hào)（如果省略苛败，則為默認(rèn)端口號(hào)）、路徑和文件名組成径簿，如http://www.domainname.com:80/myhtml/test.html 罢屈。
此url協(xié)議為http協(xié)議
域名為www.domainname.com
端口號(hào)為80
路徑為/myhtml/test.html，文件名為test.html篇亭。
URL常用的協(xié)議
- http 超文本傳輸協(xié)議
- https 加密的超文本傳輸協(xié)議
- ftp 文件傳輸協(xié)議
- file 訪問本地電腦上的文件
- mailto 電子郵件地址
具體過程介紹
一缠捌、域名解析
世界上所有互聯(lián)網(wǎng)訪問者的瀏覽器都有將域名轉(zhuǎn)化為IP地址的請(qǐng)求（瀏覽器必須知道數(shù)字化的IP地址才能訪問網(wǎng)站）互聯(lián)網(wǎng)上的每臺(tái)設(shè)備都有他自己的ip地址，ip地址由四組數(shù)字組成译蒂，之間用點(diǎn)“.”連接曼月，如“127.0.0.1”，那么我們要訪問的網(wǎng)站所在的服務(wù)器也必然有對(duì)應(yīng)的ip地址柔昼，但是現(xiàn)實(shí)中我們不方便用數(shù)字記錄要訪問的網(wǎng)站哑芹，而具有語義化的域名很好的解決了這個(gè)問題。比如域名 www.baidu.com對(duì)應(yīng)的ip地址為202.108.22.5捕透，這就引出了DNS（domain name service)域名系統(tǒng)聪姿，DNS是因特網(wǎng)上域名和ip地址相互映射的一個(gè)分布式數(shù)據(jù)庫(kù)，里面記錄了成千上萬對(duì)域名和ip地址的對(duì)應(yīng)關(guān)系乙嘀。
域名解析的具體流程可以分為5步：
- 瀏覽器首先搜素自己的DNS緩存末购，如果沒有的話會(huì)執(zhí)行第二步
- 搜索系統(tǒng)上的hosts文件，看其中是否有域名和對(duì)應(yīng)ip虎谢，沒有的話執(zhí)行第三步
- 搜索路由器的DNS緩存盟榴，一般路由器也會(huì)緩存DNS一段時(shí)間，沒有的話執(zhí)行第四步
- 搜索ISP DNS緩存婴噩，ISP(Internet Service Provider)擎场，互聯(lián)網(wǎng)服務(wù)提供商，比如到電信的DNS上查找緩存讳推，如果都沒有找到顶籽，則向根域名服務(wù)器發(fā)送查找請(qǐng)求，根域名服務(wù)器會(huì)指引到該域名的權(quán)威域名服務(wù)器银觅，直到找到 IP礼饱。
8.8.8.8是Google提供的免費(fèi)的DNS服務(wù)器的ip地址
114.114.114.114是國(guó)內(nèi)第一個(gè)，全球第三個(gè)開放的DNS服務(wù)器的ip地址
DNS劫持：是指一些刻意制造或無意中制造出來的域名服務(wù)器數(shù)據(jù)包，把域名指往不正確的IP地址
二镊绪、服務(wù)器處理
服務(wù)器是一臺(tái)安裝系統(tǒng)的機(jī)器匀伏，常見的系統(tǒng)如Linux、windows server2012等蝴韭。
系統(tǒng)里安裝的處理請(qǐng)求的應(yīng)用叫Web server（web服務(wù)器）够颠。
常見的web服務(wù)器有Apache、Nginx榄鉴、IIS履磨、Lighttpd。
web服務(wù)器接收用戶的請(qǐng)求庆尘，或者接受請(qǐng)求反向代理到其他 web服務(wù)器剃诅。
通常情況下，一臺(tái)服務(wù)器中有很多網(wǎng)站驶忌，web server可以根據(jù)請(qǐng)求的域名找到其對(duì)應(yīng)的網(wǎng)站矛辕，或者反向代理到其他web server，然后再把用戶的請(qǐng)求交給該網(wǎng)站的代碼進(jìn)行處理付魔，如下圖所示：
三聊品、網(wǎng)站處理流程
什么是MVC，M代表Model（模型）：是應(yīng)用程序中用于處理應(yīng)用程序數(shù)據(jù)邏輯的部分几苍，通常模型對(duì)象負(fù)責(zé)在數(shù)據(jù)庫(kù)中存取數(shù)據(jù)翻屈。
V代表View（視圖）：是應(yīng)用程序中處理數(shù)據(jù)顯示的部分。擦剑，通常視圖是依據(jù)模型數(shù)據(jù)創(chuàng)建的妖胀。（前端工程師主要負(fù)責(zé)）
Controller（控制器）：是應(yīng)用程序中處理用戶交互的部分，通郴堇眨控制器負(fù)責(zé)從視圖讀取數(shù)據(jù)，控制用戶輸入爬坑，并向模型發(fā)送數(shù)據(jù)纠屋。
四、瀏覽器處理與繪制
瀏覽器是一個(gè)邊解析邊渲染的過程盾计，它首先解析HTML文件構(gòu)建DOM樹售担，然后解析CSS文件構(gòu)建渲染樹，待渲染樹構(gòu)建完成后署辉，瀏覽器開始布局渲染樹并將它繪制到屏幕上
JS的解析是由瀏覽器的JS解析引擎完成的族铆，JS是單線程運(yùn)行，也就是說哭尝，在同一時(shí)間內(nèi)只能做一件事哥攘，所有的任務(wù)都需要排隊(duì)，前一個(gè)任務(wù)結(jié)束，后一個(gè)任務(wù)才能開始逝淹。
瀏覽器在解析過程中耕姊，如果遇到請(qǐng)求外部資源時(shí)請(qǐng)求過程是異步的，并不會(huì)印象HTML文件的加載栅葡。但是當(dāng)文件加載過程中遇到JS文件茉兰，HTML文檔會(huì)暫停渲染過程，不僅要等待JS文件加載完畢欣簇，還要等待其執(zhí)行完畢规脸，原因是JS文件有可能更改文檔的DOM結(jié)構(gòu)，也就是說JS文件執(zhí)行完畢前熊咽，后續(xù)所有資源的下載是沒有必要的莫鸭，這就是JS阻塞后續(xù)資源下載的根本原因。CSS文件的加載不影響JS文件的加載网棍，但是卻影響JS文件的執(zhí)行黔龟。JS代碼執(zhí)行前必須保證CSS文件已經(jīng)下載并加載完畢。
