從輸入一個URL到頁面呈現，網絡上都發生了什麼？

概括一下其中涉及到前端的一些基礎知識，主要包括：http協議、web標準、w3c標準等。
       這個問題雖然只有兩個2個動做：輸入URL和呈現頁面，但這背後發生了不少"有趣"的事情,這個過程也涉及到不少方面的技術,包括像瀏覽器、DNS、http、html、服務器等。若是讓我來回答,它大體的過程應該是這樣的：DNS解析-->創建鏈接，發送數據包 -->服務器響應請求，返回給瀏覽器-->瀏覽器渲染程序頁面。

      1.DNS解析
      當我搜索這個問題的時候，首先在瀏覽器輸入了一個URL地址，但URL中服務器地址是一個域名而不是一個指定的IP地址，路由器並不知道你想要查找的地址，那麼DNS域名解析系統會將該域名解析成ip，而IP地址是惟一的， 每個ip地址對應網絡上的一臺計算機。
                                                                                                                       
      URL（Uniform Resoure Locator）統一資源定位器，URL的組成：<scheme>資源類型+<host>服務器地址(域名/ip):<port>端口號/path路徑(服務器資源的路徑)
    
      2.創建網絡鏈接，發送數據包
      因爲1的努力，已經可以根據ip和端口號與網絡上對應的服務器創建鏈接，瀏覽器這邊會向服務器發送一個數據包，裏面包含了大量的信息，但這個數據包有必定的格式。就像我給你郵個快遞，也得遵循郵遞公司的一些規則吧！我得寫上個人身份信息、寄的物品、標明郵遞地址....道理是同樣的，到了網絡中這些規則就是「Http協議(網絡協議)」。
                                                                                 
       涉及到的一些問("面試")題：
       什麼是http協議？它的主要內容。
       http協議是客戶端和服務器端二者通訊共同遵循的一些規則。主要內容是定義了客戶端如何向服務器請求資源，服務器如何響應客戶端請求。
       請求中的POST與 GET方法有什麼區別？
          1.根據HTTP規範，GET用於信息獲取，並且應該是安全的,這裏的安全是指非修改的信息，就像在數據庫執行查詢同樣，不會修改數據，也不會增長刪減數據，不會影響資源的狀態，而post可能會改變數據的原始狀態。
          2.GET提交的數據最多隻有1024字節，理論上POST是沒有限制的。
          3.從請求的URL中能夠找到一個區別：GET請求的數據會附在URL以後，在瀏覽器URL欄就能看的。彷佛POST比GET更可靠一些，由於它請求把提交的數據放在包體中，地址欄上不可見。（也有的解釋說二者都沒有長度限制，根本的區別就是一個是獲取數據，一個修改數據！）
                                                                                    
      3.服務器響應請求，返回給瀏覽器
       服務器會分解你的數據包，例如你查找的是一個文檔，那麼服務器可能會返回一個doc文檔或者zip壓縮資源給你；若是你訪問的是一個連接頁面，那麼服務器相應的返回一個包含HTML/CSS標記文檔，這些請求和響應都有一個通用的寫法，這些規則也就是前面提到的"http協議"。
      客戶端向服務器請求資源時，除了告訴服務器要請求的資源，同時還會附帶一些其餘的信息，這部分信息放在"header"部分（服務器響應請求也同樣！），主要有請求頭(略)和響應頭，這裏以響應頭部信息爲例：
                       

http響應頭詳解：
       Request URL:https://static.zhihu.com/static/revved/-/css/m.652b53b3.css
       Request Method:GET
       Status Code:200 OK (from cache)
       Remote Address:123.125.110.16:443
       Response Headers
       accept-ranges:bytes //在整個返回體中本部分的字節位置
       access-control-allow-origin:*//跨域請求，*則容許全部域名的腳本訪問該資源。
       cache-control:max-age=600  //指定請求和響應遵循的緩存機制，當你請求頭裏設置no-cache時，是告訴服務器我這裏沒有緩存。響應頭裏這裏設置的時間是600,意思瀏覽器600秒以內別來找我，本身去緩存找吧！
       content-encoding:gzip   // web服務器支持的返回內容壓縮編碼類型爲gzip，web服務器代表本身使用了什麼壓縮方法。
       content-length:49207 //資源長度
       content-type:text/css //告訴客戶端，資源文件的類型，通常還有字符編碼，例如charset=UTF-8，客戶端將經過utf-8對資源進行解碼，而後對資源進行html解析。
       date:Mon, 07 Mar 2016 12:23:37 GMT//記錄時間
       expires:Mon, 07 Mar 2016 12:33:37 GMT //代表該實體將於何時過時
       last-modified:Mon, 07 Mar 2016 07:19:19 GMT//請求資源的最後修改時間
       server:nnws/1.7.3.6 //服務器信息，by the way!這是啥服務器？
       status:200 OK //狀態碼
       version:HTTP/1.1 //http協議版本1.1
       x-cache-lookup:Hit From MemCache Gz //查看服務器中是否有某個網頁緩存,有則返回Hit,沒有返回Miss
看到http響應狀態碼我忽然想到了404,= =！順便帶幾個常見的：
       100  Continue  繼續，通常在發送post請求時，已發送了http、header以後服務端將返回此信息，表示確認，以後發送具體參數信息
       200 OK   正常返回信息
       201  Created  請求成功而且服務器建立了新的資源
       301  Moved Permanently  請求的網頁已永久移動到新位置。
       400 Bad Request  服務器沒法理解請求的格式，客戶端不該當嘗試再次使用相同的內容發起請求。
       404 Not Found  找不到如何與 URI 相匹配的資源。   
       500 Internal Server Error  最多見的服務器端錯誤。

      4.瀏覽器渲染呈現
         瀏覽器拿到響應的頁面代碼，將其解析呈如今用戶面前，至於爲何會是看到的這個樣子，有時又是另外的一些頁面效果，這裏就涉及到web標準了，也就是咱們常常提到的w3c標準。根據資源的類型，在網頁上呈現給用戶，這個過程叫網頁渲染。解析和呈現的過程主要由瀏覽器的渲染引擎實現，瀏覽器的渲染引擎質量就決定了瀏覽器的好壞（引擎這一塊已經超出了個人理解範圍了）。
       W3c標準：
        web標準不是某一個標準，而是一系列標準的集合。
        網頁主要由三部分組成：結構（Structure）、表現（Presentation）和行爲（Behavior）。
        對應的標準也分三方面：結構化標準語言主要包括XHTML和XML，表現標準語言主要包括CSS，行爲標準主要包括對象模型（如W3C DOM）、ECMAScript等。這些標準大部分由萬維網聯盟（外語縮寫：W3C）起草和發佈，也有一些是其餘標準組織制訂的標準，好比ECMA（European Computer Manufacturers Association）的ECMAScript標準。
        HTML、XHTML、XML三者有什麼區別？
        從名字上基本能夠看出點端倪,HTML是超文本標記語言，XHTML是可擴展超文本標記語言，XHTML比HTML更加規範、嚴格。實際上是用xml語意從新定義了html，XHTML是扮演者html角色的可擴展標記語言（就是XML）。XHTML是一個過渡技術，結合了XML的強大功能，及大多數html的基本特性。能夠這麼認爲：XHTML=XML+HTML,XHTML被創造出來的目的是取代HTML，顯然它並無完成歷史使命。
        爲何HTML5裏面咱們不須要DTD（Document Type Definition文檔類型定義）？
HTML5使用最新的HTML標準，它並無使用SGML或者XHTML，可是你仍然須要使用<! DOCTYPE html>讓瀏覽器識別這是HTML文檔。
        順便帶一下SGML
        SGML（標準通用標記語言）是一個標準，告訴咱們怎麼去指定文檔標記。他是隻描述文檔標記應該是怎麼樣的元語言，HTML是被用SGML描述的標記語言。
所以利用SGML建立了HTML參照和必須共同遵照的DTD，你會常常在HTML頁面的頭部發現「DOCTYPE」屬性，用來定義用於解析目標DTD。(2016-3-8晚補充更新)
    
     但實際上輸入URL到頁面呈現這背後涉及的內容遠遠不止這些，例如後臺web服務器、雙向的網絡數據傳輸、http緩存策略等，這些知識沒有時間再去羅列！概括一下其中涉及到前端的一些基礎知識，主要包括：http協議、web標準、w3c標準等。
       這個問題雖然只有兩個2個動做：輸入URL和呈現頁面，但這背後發生了不少"有趣"的事情,這個過程也涉及到不少方面的技術,包括像瀏覽器、DNS、http、html、服務器等。若是讓我來回答,它大體的過程應該是這樣的：DNS解析-->創建鏈接，發送數據包 -->服務器響應請求，返回給瀏覽器-->瀏覽器渲染程序頁面。

      1.DNS解析
      當我搜索這個問題的時候，首先在瀏覽器輸入了一個URL地址，但URL中服務器地址是一個域名而不是一個指定的IP地址，路由器並不知道你想要查找的地址，那麼DNS域名解析系統會將該域名解析成ip，而IP地址是惟一的， 每個ip地址對應網絡上的一臺計算機。
                                                                                                                       
      URL（Uniform Resoure Locator）統一資源定位器，URL的組成：<scheme>資源類型+<host>服務器地址(域名/ip):<port>端口號/path路徑(服務器資源的路徑)
    
      2.創建網絡鏈接，發送數據包
      因爲1的努力，已經可以根據ip和端口號與網絡上對應的服務器創建鏈接，瀏覽器這邊會向服務器發送一個數據包，裏面包含了大量的信息，但這個數據包有必定的格式。就像我給你郵個快遞，也得遵循郵遞公司的一些規則吧！我得寫上個人身份信息、寄的物品、標明郵遞地址....道理是同樣的，到了網絡中這些規則就是「Http協議(網絡協議)」。
                                                                                 
       涉及到的一些問("面試")題：
       什麼是http協議？它的主要內容。
       http協議是客戶端和服務器端二者通訊共同遵循的一些規則。主要內容是定義了客戶端如何向服務器請求資源，服務器如何響應客戶端請求。
       請求中的POST與 GET方法有什麼區別？
          1.根據HTTP規範，GET用於信息獲取，並且應該是安全的,這裏的安全是指非修改的信息，就像在數據庫執行查詢同樣，不會修改數據，也不會增長刪減數據，不會影響資源的狀態，而post可能會改變數據的原始狀態。
          2.GET提交的數據最多隻有1024字節，理論上POST是沒有限制的。
          3.從請求的URL中能夠找到一個區別：GET請求的數據會附在URL以後，在瀏覽器URL欄就能看的。彷佛POST比GET更可靠一些，由於它請求把提交的數據放在包體中，地址欄上不可見。（也有的解釋說二者都沒有長度限制，根本的區別就是一個是獲取數據，一個修改數據！）
                                                                                    
      3.服務器響應請求，返回給瀏覽器
       服務器會分解你的數據包，例如你查找的是一個文檔，那麼服務器可能會返回一個doc文檔或者zip壓縮資源給你；若是你訪問的是一個連接頁面，那麼服務器相應的返回一個包含HTML/CSS標記文檔，這些請求和響應都有一個通用的寫法，這些規則也就是前面提到的"http協議"。
      客戶端向服務器請求資源時，除了告訴服務器要請求的資源，同時還會附帶一些其餘的信息，這部分信息放在"header"部分（服務器響應請求也同樣！），主要有請求頭(略)和響應頭，這裏以響應頭部信息爲例：
                       

http響應頭詳解：
       Request URL:https://static.zhihu.com/static/revved/-/css/m.652b53b3.css
       Request Method:GET
       Status Code:200 OK (from cache)
       Remote Address:123.125.110.16:443
       Response Headers
       accept-ranges:bytes //在整個返回體中本部分的字節位置
       access-control-allow-origin:*//跨域請求，*則容許全部域名的腳本訪問該資源。
       cache-control:max-age=600  //指定請求和響應遵循的緩存機制，當你請求頭裏設置no-cache時，是告訴服務器我這裏沒有緩存。響應頭裏這裏設置的時間是600,意思瀏覽器600秒以內別來找我，本身去緩存找吧！
       content-encoding:gzip   // web服務器支持的返回內容壓縮編碼類型爲gzip，web服務器代表本身使用了什麼壓縮方法。
       content-length:49207 //資源長度
       content-type:text/css //告訴客戶端，資源文件的類型，通常還有字符編碼，例如charset=UTF-8，客戶端將經過utf-8對資源進行解碼，而後對資源進行html解析。
       date:Mon, 07 Mar 2016 12:23:37 GMT//記錄時間
       expires:Mon, 07 Mar 2016 12:33:37 GMT //代表該實體將於何時過時
       last-modified:Mon, 07 Mar 2016 07:19:19 GMT//請求資源的最後修改時間
       server:nnws/1.7.3.6 //服務器信息，by the way!這是啥服務器？
       status:200 OK //狀態碼
       version:HTTP/1.1 //http協議版本1.1
       x-cache-lookup:Hit From MemCache Gz //查看服務器中是否有某個網頁緩存,有則返回Hit,沒有返回Miss
看到http響應狀態碼我忽然想到了404,= =！順便帶幾個常見的：
       100  Continue  繼續，通常在發送post請求時，已發送了http、header以後服務端將返回此信息，表示確認，以後發送具體參數信息
       200 OK   正常返回信息
       201  Created  請求成功而且服務器建立了新的資源
       301  Moved Permanently  請求的網頁已永久移動到新位置。
       400 Bad Request  服務器沒法理解請求的格式，客戶端不該當嘗試再次使用相同的內容發起請求。
       404 Not Found  找不到如何與 URI 相匹配的資源。   
       500 Internal Server Error  最多見的服務器端錯誤。

      4.瀏覽器渲染呈現
         瀏覽器拿到響應的頁面代碼，將其解析呈如今用戶面前，至於爲何會是看到的這個樣子，有時又是另外的一些頁面效果，這裏就涉及到web標準了，也就是咱們常常提到的w3c標準。根據資源的類型，在網頁上呈現給用戶，這個過程叫網頁渲染。解析和呈現的過程主要由瀏覽器的渲染引擎實現，瀏覽器的渲染引擎質量就決定了瀏覽器的好壞（引擎這一塊已經超出了個人理解範圍了）。
       W3c標準：
        web標準不是某一個標準，而是一系列標準的集合。
        網頁主要由三部分組成：結構（Structure）、表現（Presentation）和行爲（Behavior）。
        對應的標準也分三方面：結構化標準語言主要包括XHTML和XML，表現標準語言主要包括CSS，行爲標準主要包括對象模型（如W3C DOM）、ECMAScript等。這些標準大部分由萬維網聯盟（外語縮寫：W3C）起草和發佈，也有一些是其餘標準組織制訂的標準，好比ECMA（European Computer Manufacturers Association）的ECMAScript標準。
        HTML、XHTML、XML三者有什麼區別？
        從名字上基本能夠看出點端倪,HTML是超文本標記語言，XHTML是可擴展超文本標記語言，XHTML比HTML更加規範、嚴格。實際上是用xml語意從新定義了html，XHTML是扮演者html角色的可擴展標記語言（就是XML）。XHTML是一個過渡技術，結合了XML的強大功能，及大多數html的基本特性。能夠這麼認爲：XHTML=XML+HTML,XHTML被創造出來的目的是取代HTML，顯然它並無完成歷史使命。
        爲何HTML5裏面咱們不須要DTD（Document Type Definition文檔類型定義）？
HTML5使用最新的HTML標準，它並無使用SGML或者XHTML，可是你仍然須要使用<! DOCTYPE html>讓瀏覽器識別這是HTML文檔。
        順便帶一下SGML
        SGML（標準通用標記語言）是一個標準，告訴咱們怎麼去指定文檔標記。他是隻描述文檔標記應該是怎麼樣的元語言，HTML是被用SGML描述的標記語言。
所以利用SGML建立了HTML參照和必須共同遵照的DTD，你會常常在HTML頁面的頭部發現「DOCTYPE」屬性，用來定義用於解析目標DTD。(2016-3-8晚補充更新)
    
     但實際上輸入URL到頁面呈現這背後涉及的內容遠遠不止這些，例如後臺web服務器、雙向的網絡數據傳輸、http緩存策略等，這些知識沒有時間再去羅列！