「觀感度：🌟🌟🌟🌟🌟」
「口味：剁椒魚頭」
「烹飪時間：20min」
本文已收錄在Github，https://github.com/Geekhyt/front-end-canteen，感謝Star。
從淡黃的長裙和蓬鬆的頭髮我察覺到，面前坐著的這位女面試官屬實是有點東西。我的自我介紹也變得聲情並茂起來。Skr~~~ 在此期間，小姐姐面無改色的看著我的簡歷。不過無所謂，這些都不重要。
還是咱們的原定計劃，把面試官引到了咱們最擅長的領域。
你覺得自己最擅長的是什麼？
HTTP 協議吧，我還算比較了解。
0.那你說一下OSI 網絡分層模型是怎樣分層的？應用層、表示層、會話層、傳輸層、網絡層、數據鏈路層、物理層
application layer、presentation layer、session layer、transport layer、network layer、data link layer、physical layer
1.TCP/IP 網絡分層模型是怎樣分層的？應用層、傳輸層、網際層、連結層
application layer、transport layer、internet layer、link layer
2.TCP 和 UDP 區別？TCP 和 UDP 都是傳輸層的協議，但二者有著截然不同的基因。
TCP：
UDP：
3.TCP 的三次握手和四次揮手簡單說一下三次握手2.服務端收到並返回 SYN 以及 ACK 客戶端的 SYN
3.客戶端收到服務端的 SYN 和 ACK 後，發送 ACK 的 ACK 給服務端，服務端收到後連接建立
Server -> SYN/ACK -> Client
四次揮手4.客戶端收到後，發送 ACK 的 ACK 給服務端，服務端關閉，客戶端等待 2MSL 後關閉
Client -> ACK -> Server -> CLOSED
Client -> 2MSL 的時間 -> CLOSED
4.什麼是HTTP協議？(小白回答版)
HTTP 就是超文本傳輸協議呀，它的英文是 HyperText Transfer Protocol。
敲黑板！
(羅劍鋒老師的完美回答版)
HTTP 是一個在計算機世界裡專門在兩點之間傳輸文字、圖片、音頻、視頻等超文本數據的約定和規範。
(面試官：理解的不錯)
5.你知道哪些 HTTP 的請求方法？OPTIONS 獲取伺服器支持訪問資源的方法 (冪等)TRACE 回顯伺服器收到的請求，可以定位問題。(有安全風險)6.說一下HTTP/0.9、HTTP/1.0、HTTP/1.1、HTTP/2、HTTP/3各版本之間的區別？請移步我的另一篇專欄。
HTTP的世界觀
HTTPS 就是在 HTTP 和 TCP 協議中間加入了 SSL/TLS 安全套接層。
結合非對稱加密和對稱加密的各自優點，配合證書。既保證了安全性，也保證了傳輸效率。
目前應用最廣泛的是TLS1.2，實現原理如下：
1.Client 發送 random1+對稱加密套件列表+非對稱加密套件列表2.Server 收到信息， 選擇 對稱加密套件+非對稱加密套件 並和 random2+證書(公鑰在證書中) 一起返回3.Client 驗證證書有效性，並用 random1+random2 生成 pre-master 通過伺服器公鑰加密+瀏覽器確認 發送給 Server4.Server 收到 pre-master，根據約定的加密算法對 random1+random2+pre-master（解密）生成 master-secret，然後發送伺服器確認5.Client 收到生成同樣的 master-secert，對稱加密秘鑰傳輸完畢TLS1.3 則簡化了握手過程，完全握手只需要一個消息往返，提升了性能。不僅如此，還對部分不安全的加密算法進行了刪減。
8.你所謂的約定的加密算法應該是 ECDHE 橢圓算法吧？HTTP 傳輸消息都是明文的，黑客完全可以作為中間人劫持消息，再利用 ECDHE 算法，這樣不就能破解密鑰了嗎？ECDHE 算法利用了橢圓曲線和離散對數等思想，按照當下的計算機算力，很難在短時間進行破解。且每次握手時生成的都是一對臨時的公鑰和私鑰，這樣就保證每次的密鑰對也不同。
即使大費力氣破解了一次的密鑰，之前的歷史消息也不會受到影響，保證了前向安全。
當然，TLS 協議的安全性受限於當下最快的計算機運行速度，理論上絕對安全的是量子通訊傳遞密鑰。
(面試官：小夥子有點東西)
(基操，勿6)
9.說一說你對DNS的理解？DNS (Domain Name System)是網際網路中的重要基礎設施，負責對域名的解析工作，為了保證高可用、高並發和分布式，它設計成了樹狀的層次結構。
由根DNS伺服器、頂級域 DNS 伺服器和權威 DNS 伺服器組成。
解析順序是首先從瀏覽器緩存、作業系統緩存以及本地 DNS 緩存 (/etc/hosts) 逐級查找，然後從本地 DNS 伺服器、根 DNS、頂級 DNS 以及權威 DNS層層遞歸查詢。
還可以基於域名在內網、外網進行負載均衡。
不過傳統的 DNS 有很多問題(解析慢、更新不及時)，HTTPDNS 通過客戶端 SDK 和服務端配合，直接通過 HTTP 調用解析 DNS 的方式，可以繞過傳統 DNS 這些缺點，實現智能調度。
(面試官：小夥子理解的挺細啊)
10.說一說你對 CDN 的理解？CDN（Content Delivery Network）就是內容分發網絡。
為了突破現實生活中的光速、傳輸距離等物理限制，CDN 投入了大量資金，在全球範圍內各大樞紐城市建立機房，部署大量高存儲高帶寬的節點，構建跨運營商、跨地域的專用高速傳輸網絡。
其中分為中心節點、區域節點、邊緣節點等，在用戶接入網絡後，首先通過全局負載均衡 (Global Sever Load Balance)，簡稱 GSLB 算法負責調度，找到離用戶最合適的節點。然後通過 HTTP 緩存代理技術進行緩存，緩存命中就返回給用戶，否則就回源站去取。CDN 擅長緩存靜態資源(圖片、音頻等)，當然也支持動態內容的緩存。
11.說一說你對 WebSocket 的理解？WebSocket 是一種基於 TCP 的輕量級網絡通信協議。和 HTTP/2 一樣，都是為了解決 HTTP 某些方面的缺陷而誕生的。不過解決方式略有不同，HTTP/2 針對的是「隊頭阻塞 」，WebSocket 針對的是「請求-應答」的通信模式。
我們知道「請求-應答」是半雙工的通信模式，不具備伺服器推送能力。這就限制了 HTTP 在實時通信領域的發展。雖然可以使用輪詢來不停的向伺服器發送 HTTP 請求，但是缺點也很大，反覆的無效請求佔用了大量的帶寬和 CPU 資源。所以，WebSocket 應運而生。
WebSocket 是一個全雙工通信協議，具備服務端主動推送的能力。本質上是對 TCP 做了一層包裝，讓它可以運行在瀏覽器環境裡。
看過我這篇專欄「吐血整理」再來一打Webpack面試題 的同學們一定知道，Webpack 的熱更新中就利用了這種協議。當然，在即時通訊、遊戲以及可視化大屏展示等領域中也都有著 WebSocket 的身影。
(關於 WebSocket 的過多細節這裡不再展開，後續有機會在專欄中詳細介紹，感興趣的同學們可以先自行學習）
12.HTTP 的緩存策略知道嗎？強緩存伺服器使用 Cache-Control 來設置緩存策略，常用 max-age 來表示資源的有效期。
(這裡的 max-age 的時間計算起點是響應報文的創建時刻，而不是客戶端收到報文的時刻。)
(瀏覽器也可以發送 Cache-Control 欄位，使用 max-age=0 或 no-cache 來刷新數據)
如果想更精確的控制緩存策略，還可以使用 Cache-Control 的其他屬性：
no-store：不允許緩存 (用於秒殺頁面等變化頻率非常高的場景)no-cache：可以緩存，使用前必須要去服務端驗證是否過期，是否是最新版本must-revalidate：如果緩存不過期就可以繼續使用，過期了就必須去服務端驗證協商緩存驗證資源是否失效就需要使用條件請求。常用的是 If-Modified-Since 和 If-None-Match，收到 304 狀態碼就可以復用緩存裡的資源。
(If-None-Match 比 If-Modified-Since 優先級更高)
驗證資源是否被修改的條件有兩個 Last-modified 和 ETag (ETag 比 Last-modified 的精確度更高)，需要預先在服務端的響應報文裡設置，配合條件請求使用。
13.HTTP 如何進行內容協商？內容協商就是每個 URI 指向的資源可以是任何事物，可以有很多不同的表述。對於文檔來說，可以有不同的語言、不同的媒體格式，並針對不同的瀏覽器提供不同的壓縮編碼。
客戶端在請求頭部中提出需要的表述形式，伺服器根據其來進行特定表述服務端返回 300 或者 406，由客戶端選擇一種表述協商要素內容編碼 (Accept-Encoding:gzip,deflate,br)表述語言 (Accept-Language:zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7)14.說一說 HTTP 的重定向重定向是伺服器發起的跳轉，要求客戶端使用新的 URI 重新發送請求。在響應頭欄位 Location 中指示了要跳轉的 URI。使用 Refresh 欄位，還可以實現延時重定向。
301 / 302 是常用的重定向狀態碼。分別代表永久性重定向和臨時性重定向。
除此之外還有：
303：類似於 302，重定向後的請求方法改為 GET 方法307：類似於 302，含義比 302 更明確，重定向後請求的方法和實體不允許變動308：類似於 301，代表永久重定向，重定向後請求的方法和實體不允許變動300：是一個特殊的重定向狀態碼，會返回一個有多個連結選項的頁面，由用戶自行選擇304：是一個特殊的重定向狀態碼，服務端驗證過期緩存有效後，要求客戶端使用該緩存15.你知道哪些 HTTP 的常用的首部欄位？(上文中提到過一些，這裡只列舉一些常用的)
(開始報菜名)
通用首部欄位Transfor-Encoding 報文主體的傳輸編碼格式請求首部欄位Host 請求資源所在的伺服器 (唯一一個HTTP/1.1規範裡要求必須出現的欄位)If-None-Match 比較實體標記 (ETag)，與 If-Match 相反If-Modified-Since 比較資源更新時間 (Last-Modified)If-Unmodified-Since 比較資源更新時間 (Last-Modified)， 與 If-Modified-Since 相反響應首部欄位實體首部欄位16.你知道哪些 HTTP 狀態碼？(上文中提到過一些，這裡只列舉一些常用的)
(開始報菜名)
1xx1xx：請求已經接收到，需要進一步處理才能完成，HTTP/1.0 不支持101 Switch Protocols：協議升級使用102 Processing：伺服器已經收到並正在處理請求，但無響應可用2xx201 Created：有新資源在伺服器端被成功創建202 Accepted：伺服器接受並開始處理請求，但請求未處理完成206 Partial Content：使用range協議時返回部分響應內容時的響應碼3xx請查閱上文重定向部分，這裡不再贅述。
4xx400 Bad Request：伺服器認為客戶端出現了錯誤，但不明確，一般是 HTTP 請求格式錯誤401 Unauthorized：用戶認證信息確實或者不正確403 Forbidden：伺服器理解請求的含義，但沒有權限執行407 Proxy Authentication Required：對需要經由代理的請求，認證信息未通過代理伺服器的驗證404 Not Found：伺服器沒有找到對應的資源408 Request Timeout：伺服器接收請求超時5xx500 Internal Server Error：伺服器內部錯誤，且不屬於以下錯誤類型502 Bad Gateway：代理伺服器無法獲取到合法響應503 Service Unavailable：伺服器資源尚未準備好處理當前請求505 HTTP Version Not Supported：請求使用的 HTTP 協議版本不支持小姐姐拿起桌旁已經涼透的芋泥波波奶茶，喝了一口。
(精神小夥啊)
參考❤️愛心三連擊1.看到這裡了就點個在看支持下吧，你的「在看」是我創作的動力。
2.關注公眾號前端開發博客，回復「加群」與我一起交流!
相關文章最後轉發文章並關注公眾號：前端開發博客，回復 1024，領取前端進階資料
回復「JavaScript」獲取 JavaScript 精選文章