對於任何一個有志於從事Web研發(無論前端或後端)的人來講,瞭解這一基礎知識都是十分必要的。因而,做爲一個志於從事前端研發的好少年,我也研究了一下這個問題,並以通俗簡單的形式整理下來,一方面加深本身的理解,另外一方面若是能幫到幾我的,那固然是最好的了。html
1、URL
URL(Uniform Resource Locator)統一資源定位符是對能夠從互聯網上獲得的資源的位置和訪問方法的一種簡潔的表示,是互聯網上標準資源的地址。互聯網上的每一個文件都有一個惟一的URL,它包含的信息指出文件的位置以及瀏覽器應該怎麼處理它。
基本URL包含模式(或稱協議)、服務器名稱(或IP地址)、路徑和文件名,如:協議://用戶名:密碼@子域名.域名.頂級域名:端口號/目錄/文件名.文件後綴?參數=值#標誌。咱們能夠把URL分割成3個部分:協議、網絡地址、資源路徑。
網絡地址指示該鏈接網絡上哪一臺計算機,能夠是域名或者IP地址,能夠包括端口號;
協議是從該計算機獲取資源的方式,常見的是HTTP、HTTPS、FTP,不一樣協議有不一樣的通信內容格式;
資源路徑指示從服務器上獲取哪一項資源。
好比你訪問http://www.daidaixiong.com/
協議部分:http
網絡地址:www.daidaixiong.com
資源路徑:/前端
2、DNS
DNS(Domain Name System,域名系統),因特網上做爲域名和IP(Internet Protocol Address)地址相互映射的一個分佈式數據庫,可以使用戶更方便的訪問互聯網,而不用去記住可以被機器直接讀取的IP數串。經過主機名,最終獲得該主機名對應的IP地址的過程叫作域名解析(或主機名解析)。DNS協議運行在UDP協議之上,使用端口號53。
在整個互聯網體系中,約定俗成的用於標識網絡上設備的地址是IP,=E4__咱們輸入的是DNS,由於域名更方便人們記憶,否則那麼多網站,人怎麼可能記住全部的IP地址。
那這樣瀏覽器就必須知道這個域名對應的IP才能知道服務器真正的地址。那瀏覽器如何去查詢URL對應的IP呢?
瀏覽器緩存:瀏覽器會按照必定的頻率緩存DNS記錄。
操做系統緩存:若是瀏覽器緩存中找不到須要的DNS記錄,那就去操做系統中找。
路由緩存:路由器也有DNS緩存。
ISP的DNS服務器:ISP是互聯網服務提供商(Internet Service Provider)的簡稱,ISP有專門的DNS服務器應對DNS查詢請求。
根服務器:ISP的DNS服務器還找不到的話,它就會向根服務器發出請求,進行遞歸查詢。遞歸查詢的意思就是,DNS服務器先問根域名服務器.com域名服務器的IP地址,而後再問.com域名服務器,依次類推。web
不少人都會問,在網上查到某個網站的IP地址,在本身的瀏覽器上輸入爲何就鏈接不上。緣由是大的高併發網站可能不止一個IP地址,根據不一樣的網絡他們會有不少的IP來作集羣。有的是經過DNS來實現負載均衡,有的是用squid來實現的。這裏就不對其展開了。數據庫
3、TCP三次握手鍊接
當DNS解析完成後,咱們就擁有了目標IP和端口號,瀏覽器知道了服務器的IP地址以後就要跟服務器創建鏈接了。
瀏覽器先發一個報文段,告訴服務器我想上你;服務器收到後回覆一個報文段說我準備好了,能夠上;瀏覽器收到了以後回覆說我也準備好了,而且告訴服務器:你已經容許我上你了。三次握手以後,TCP鏈接就創建起來了,這個時候,瀏覽器就能夠和服務器進行正式通訊了,也就是開始基於HTTP協議的信息交換。後端
4、HTTP通訊
超文本傳輸協議(HTTP,HyperText Transfer Protocol)是互聯網上應用最爲普遍的一種網絡協議。全部的WWW文件都必須遵照這個標準。設計HTTP最初的目的是爲了提供一種發佈和接收HTML頁面的方法。HTTP規定了客戶機和服務器之間溝通的「語言」和規則,就好像兩我的之間要正常對話必須基於共同的語言同樣,沒有HTTP,客戶機和服務器的對話極可能變成雞同鴨講。
在web應用中,瀏覽器端發送請求數據包,服務器端返回響應數據包來實現web應用
程序的工做。當服務器向客戶端返回響應後,整個鏈接就會關閉,是一種無狀態的鏈接。
因而你的瀏覽器按照HTTP協議發出了請求,請求長成這個樣子:
GET http://daidaixiong.com/ HTTP/1.1
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
Accept-Encoding:gzip, deflate, sdch
Accept-Language:zh-CN,zh;q=0.8
Cache-Control:max-age=0
Connection:keep-alive
Host:daidaixiong.com
Upgrade-Insecure-Requests:1
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36(KHTML, like Gecko) Chrome/53.0.2785.101 Safari/537.36
HTTP請求由請求行(request line)、首部行/請求頭部/請求頭(headerline,因爲翻譯不一致,中文名有多個)、空行、請求
數據組成。關於HTTP請求的詳細解釋能夠參考HTTP的GET和POST格式解析。瀏覽器
數據包在網絡中的漫遊經歷
首先,你要清楚網絡分層模型,OSI7層模型,但一般習慣去記憶TCP/IP的四層模型:應用層,傳輸層,網絡層(網際層IP),網絡接口層(鏈路層),不一樣版本的教材對這四層的名字不同。
TCP/IP參考模型的相關經常使用協議
應用層
HTTP、HTTPS、FTP、TELNET、SMTP、DNS
SNMP、TFTP、NTP
傳輸層
TCP
UDP
網絡層
IP、ARP、RARP
物理鏈路層
MAC地址、路由器(router)、中繼器(repeater)、集線器(hub)
在瀏覽器和服務器通訊過程當中,可能會通過緩存和代理服務器等,
緩存有瀏覽器端的緩存,有服務器端的緩存,有代理服務器的緩存,有頁面緩存,對象緩存。數據庫也有緩存,等等。
HTTP中具備緩存功能的是瀏覽器緩存,以及緩存代理服務器。緩存
5、HTML和DynamicHTML
HTML(HyperText Markup Language,超文本標記語言)是一種用於建立網頁的標準標記語言。HTML是一種基礎技術,常與CSS、JavaScript一塊兒被衆多網站用於設計使人賞心悅目的網頁、網頁應用程序以及移動應用程序的用戶界面。
傳統的HTML網頁就像搬到互聯網上的書本,與瀏覽者缺少交互。隨着互聯網應用領域的日益普遍,傳統的HTML網頁的表現力顯得捉襟見肘。爲了增_=8A_網頁的交互性和表現力,發展了不少技術:如 Java Applet、ActiveX、DHTML 等。DHTML只是在傳統的HTML的基礎之上增長了 CSS和腳本語言,很是容易掌握。
客戶機向服務器發出請求後,服務器會客戶機回送應答, HTTP/1.1 200 OK ,應答的第一部分是協議的版本號和應答狀態碼。服務器也會隨同應答向用戶發送關於它本身的數據及被請求的文檔。數據多是根據HTML協議組織的網頁,裏面包含頁面的佈局CSS、文字。數據也多是圖片、腳本程序JS等。如今你能夠用瀏覽器的「查看源代碼」功能,感覺一下服務器返回的是什麼東東。若是資源路徑指示的資源不存在,服務器就會返回著名的404錯誤。服務器
6、Web服務器
HTTP請求到達了Web服務器以後,Web服務器如何處理請求呢?
服務器這一律念既能夠指軟件也能夠指硬件,通常來講,咱們在討論Web服務的時候所說的服務器是指服務器軟件(Apache、IIS、Nginx)。Web服務器的基本功能就是存儲、處理、分發Web頁面。當客戶機向服務器發出請求後,服務器找到相應的資源(HTML文件、CSS文件、js文件、圖片、視頻等),而後以HTTP響應消息的方式發給客戶機,這樣一個完整的HTTP請求就完成了。
可是以上只是傳統的靜態網頁的服務器端處理方式,如今的網頁大可能是動態網頁,好比你登陸了微博,你看到了你關注的用戶的動態,我登陸了微博,看到的是我關注的用戶的動態,那麼難道新浪專門爲我寫了一個HTML網頁嗎?固然不可能了,這其中其實是使用了動態網頁技術,當客戶機向服務器發出請求後,服務器根據客戶機傳遞過來的參數(用戶名、會話ID等)動態生成一個頁面,而後將這個頁面傳遞給客戶機。網絡
7、CGI、FastCGI、Servlet
最開始,動態網頁技術是CGI(common gateway interface),CGI根據客戶機傳來的參數,動態地生成HTML文件,將HTML文件返回給客戶機。可是
CGI爲每個請求都會開啓一個進程,致使對服務器的消耗特別大。爲了解決這一問題,產生了CGI的加強版本FastCGI(Fast Common Gateway Interface),"與爲每一個請求建立一個新的進程不一樣,FastCGI使用持續的進程來處理一連串的請求。這些進程由FastCGI服務器管理,而不是Web服務器。 當進來一個請求時,Web服務器把環境變量和這個頁面請求經過一個Socket或者一個TCP connection傳遞給FastCGI進程。
FastCGI 的主要優勢是把動態語言和HTTP Server分離開來,因此Nginx與PHP/PHP-FPM常常被部署在不一樣的服務器上,以分擔前端Nginx服務器的壓力,使Nginx專注處理靜態請求和轉發動態請求,而PHP/PHP-FPM服務器專注解析PHP動態請求。
除了FastCGI以外,Java方面推出了Servlet,關於Servlet,《Java Servlet 3.1 規範》中是這樣定義的:「Servlet 是基於 Java 的 Web 組件,由容器進行管理,來生成動態內容」。Servlet是Java的一個公共接口(public interface),servlets是這一公共接口的實現,servlets接收並響應客戶端的請求。ServletContainer(Servlet 容器) 是 Web 服務器或者應用服務器的一部分,用於提供基於請求/響應發送模式的網絡服務,解碼基於 MIME的請求,而且格式化基於 MIME 的響應。Servlet 容器同時也包含和管理他們的生命週期裏 Servlet。併發
8、瀏覽器渲染
當服務器提供了資源以後(HTML,CSS,JS,圖片等),瀏覽器得到數據,渲染網頁而後呈現給用戶,瀏覽器會執行下面的操做:
解析 HTML,CSS,JS
渲染——構建 DOM 樹 -> 渲染 -> 佈局 -> 繪製
渲染結束後,瀏覽器根據某些時間機制運行JS代碼或與用戶交互。
聲明:部份內容採用網上信息,若有侵權,請聯繫做者刪除。