資訊專欄INFORMATION COLUMN
摘要：動態映射利用來進行域名解析，在專門的服務器上配置主機到地址的映射。前兩者都無效的情況下，向路由器發送查詢的請求，或者直接向用戶定義的服務地址發送域名解析的請求。
【前端芝士樹】從瀏覽器搜索框輸入網址到網頁呈現發生了什么？
這個也是在前端面試中問得比較多的一個問題了，文章篇幅有限盡可能關注一些前端開發中不太會遇到的知識點，如果想擴展的話請點擊引用文章吧，也歡迎評論，后續會繼續補充。0. 大致流程
看圖的話更容易記一些，
下面將會基于這幾個過程進行描述。
首先需要搞明白的是，域名和ip地址是不同的，域名是為了更方便記憶ip所產生的，ip才是服務器在網絡上的真實地址。
IP地址是用來唯一標識互聯網上計算機的邏輯地址，讓電腦之間可以相互通信，每臺連網計算機都依靠IP地址來互相區分，相互聯系。IP地址通常指的是網絡中的主機，而域名則通常表示一個網站，一個域名可以綁定到多個ip上，多個域名也可以綁定到一個ip上。
為了讓域名和地址能夠相互轉換，就需要對其進行映射，有兩種方式：
靜態映射 在瀏覽器端存儲一份域名到ip地址的映射表，只供本設備使用。
動態映射 利用DNS來進行域名解析，在專門的DNS服務器上配置主機到IP地址的映射。
DNS（Domain Name System，域名系統），萬維網上作為域名和IP地址相互映射的一個分布式數據庫，能夠使用戶更方便的訪問互聯網，而不用去記住能夠被機器直接讀取的IP數串。DNS協議運行在UDP協議之上，使用端口號53。DNS可供所有網絡上的節點使用。1.1 域名解析 && 瀏覽器查詢ip的過程
瀏覽器從緩存的映射表中尋找域名對應的記錄，如果存在則直接返回IP
緩存中如果沒有記錄命中，則進行系統調用查詢hosts，查找用戶定義的IP映射。
前兩者都無效的情況下， 向路由器發送DNS查詢的請求，或者直接向用戶定義的DNS服務地址發送域名解析的請求。
DNS服務器會從根域名服務器開始遞歸搜索，從.com頂級域名服務器，到baidu的域名服務器。2. 建立TCP連接
TCP/IP協議 / 四層模型 / 三次握手
在 TCP/IP協議組 中包含一系列用于處理數據通信的協議：
TCP (傳輸控制協議) - 應用程序之間通信
UDP (用戶數據包協議) - 應用程序之間的簡單通信
IP (網際協議) - 計算機之間的通信
ICMP (因特網消息控制協議) - 針對錯誤和狀態
DHCP (動態主機配置協議) - 針對動態尋址
...
如圖所示
TCP / IP 協議組
TCP/IP 意味著 TCP 和 IP 在一起協同工作。
TCP 負責應用軟件（比如你的瀏覽器）和網絡軟件之間的通信。
IP 負責計算機之間的通信。
TCP 負責將數據分割并裝入 IP 包，然后在它們到達的時候重新組合它們。
IP 負責將包發送至接受者。
在這其中需要著重了解一下的就是數據是如何進行處理的、TCP、IP以及TCP和UDP的區別。
數據處理流程 TCP三次握手 TCP與UDP的區別TCP 是面向連接的、可靠的流協議。流就是指不間斷的數據結構，當應用程序采用 TCP 發送消息時，雖然可以保證發送的順序，但還是猶如沒有任何間隔的數據流發送給接收端。TCP 為提供可靠性傳輸，實行“順序控制”或“重發控制”機制。此外還具備“流控制（流量控制）”、“擁塞控制”、提高網絡利用率等眾多功能。
UDP 是不具有可靠性的數據報協議。細微的處理它會交給上層的應用去完成。在 UDP 的情況下，雖然可以確保發送消息的大小，卻不能保證消息一定會到達。因此，應用有時會根據自己的需要進行重發處理。
TCP 和 UDP 的優缺點無法簡單地、絕對地去做比較：TCP 用于在傳輸層有必要實現可靠傳輸的情況；而在一方面，UDP 主要用于那些對高速傳輸和實時性有較高要求的通信或廣播通信。TCP 和 UDP 應該根據應用的目的按需使用。
瀏覽器利用IP直接與網站主機通信。瀏覽器發出TCP（SYN標志位為1）連接請求，主機返回TCP（SYN，ACK標志位均為1）應答報文，瀏覽器收到應答報文發現ACK標志位為1，表示連接請求確認。瀏覽器返回TCP（）確認報文，主機收到確認報文，三次握手，TCP連接建立完成。
3. 服務器響應請求在TCP連接建立完成后，瀏覽器向主機發起一個HTTP-GET方法報文請求。請求中包含訪問的URL，也就是http://www.baidu.com/ ，還有User-Agent用戶瀏覽器操作系統信息，編碼等。
3.1 常見的服務器狀態碼 1** 請求狀態100 Continue 繼續，一般在發送post請求時，已發送了http、header之后服務端將返回此信息，表示確認，之后發送具體參數信息
2** 響應狀態200 OK 正常返回信息
201 Created 請求成功并且服務器創建了新的資源
3** 資源狀態301 Moved Permanently 永久重定向，請求的網頁已永久移動到新位置。
4** 網頁狀態400 Bad Request 服務器無法理解請求的格式，客戶端不應當嘗試再次使用相同的內容發起請求。
404 Not Found 找不到如何與 URI 相匹配的資源。
5** 服務器狀態500 Internal Server Error 最常見的服務器端錯誤。
3.2 重定向的作用重定向是為了負載均衡或者導入流量，提高SEO排名。利用一個前端服務器接受請求，然后負載到不同的主機上，可以大大提高站點的業務并發處理能力；重定向也可將多個域名的訪問，集中到一個站點；由于baidu.com，www.baidu.com會被搜索引擎認為是兩個網站，照成每個的鏈接數都會減少從而降低排名，永久重定向會將兩個地址關聯起來，搜索引擎會認為是同一個網站，從而提高排名。
4. 瀏覽器渲染呈現瀏覽器拿到響應的頁面代碼，將其解析呈現在用戶面前。
中間會涉及到瀏覽器的渲染步驟、JS引擎、渲染引擎、事件響應等知識點。
后續會繼續補充，歡迎收藏和點贊。
參考文章
W3School - TCP/IP 簡介
一篇文章帶你熟悉 TCP/IP 協議（網絡協議篇二）
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/53042.html
摘要：這是一次失敗的面經但是吃一塹才能長一智不是嗎字節跳動校招面經前端開發崗一介紹以及項目經歷吧啦吧啦此處省略字面試官會從項目經歷入手，考察項目中遇到的難題，以及解決方法，強調個人的努力以及在解決過程中扮演的角色是主導還是參與。 這是一次失敗的面經……但是吃一塹才能長一智不是嗎？ 字節跳動2019校招面經 - 前端開發崗（一） 1. 介紹以及項目經歷 吧啦吧啦……此處省略10000字 面試官...
摘要：定義文檔資源的名稱二域名解析在瀏覽器輸入網址后，首先要經過域名解析，因為瀏覽器并不能直接通過域名找到對應的服務器，而是要通過地址。什么是域名解析協議提供通過域名查找地址，或逆向從地址反查域名的服務。 前言 打開瀏覽器從輸入網址到網頁呈現在大家面前，背后到底發生了什么？經歷怎么樣的一個過程？先給大家來張總體流程圖，具體步驟請看下文分解！本文首發地址為GitHub博客,寫文章不易，請多多支...
摘要：定義文檔資源的名稱二域名解析在瀏覽器輸入網址后，首先要經過域名解析，因為瀏覽器并不能直接通過域名找到對應的服務器，而是要通過地址。什么是域名解析協議提供通過域名查找地址，或逆向從地址反查域名的服務。 前言 打開瀏覽器從輸入網址到網頁呈現在大家面前，背后到底發生了什么？經歷怎么樣的一個過程？先給大家來張總體流程圖，具體步驟請看下文分解！本文首發地址為GitHub博客,寫文章不易，請多多支...
摘要：瀏覽器顯示及交互背后的原理引子因為筆者愛編程的光頭強近期在寫一本關于小程序入門的書籍。不基于瀏覽器背后的運行原理，是很難說清楚虛擬被引入的真正原因和最大好處的。它是瀏覽器的核心部分。 瀏覽器顯示及交互背后的原理 引子 因為筆者（愛編程的光頭強）近期在寫一本關于小程序入門的書籍。其中有一章是介紹虛擬DOM的，它是位于Javascript和真正DOM之間的一層緩存層。為什么引入它，為什么它...
摘要：瀏覽器顯示及交互背后的原理引子因為筆者愛編程的光頭強近期在寫一本關于小程序入門的書籍。不基于瀏覽器背后的運行原理，是很難說清楚虛擬被引入的真正原因和最大好處的。它是瀏覽器的核心部分。 瀏覽器顯示及交互背后的原理 引子 因為筆者（愛編程的光頭強）近期在寫一本關于小程序入門的書籍。其中有一章是介紹虛擬DOM的，它是位于Javascript和真正DOM之間的一層緩存層。為什么引入它，為什么它...
閱讀 3608·2021-11-15 11:37
閱讀 2974·2021-11-12 10:36
閱讀 4403·2021-09-22 15:51
閱讀 2381·2021-08-27 16:18
閱讀 881·2019-08-30 15:44
閱讀 2163·2019-08-30 10:58
閱讀 1768·2019-08-29 17:18
閱讀 3268·2019-08-28 18:25
