Blog icon indicating copy to clipboard operation
Blog copied to clipboard

當你在瀏覽網址欄上輸入 google.com 按下 Enter 接下來會發生甚麼事?

Open ChaoLiou opened this issue 6 years ago • 0 comments

這篇文章可以保持輕鬆的心情看... 裡面包含許多網路知識(還有一些省略), 不如就快速掃完整篇文章, 然後下個結論(像我一樣): 原來我還有這些不懂, 看來我還很菜阿~.

[name=Chaol Liu][time=20180815] derived from...

What happens when you type 'google.com' into a browser and press Enter?

dev.to

[name=@AntonFrattaroli] [time=Wed, 26 Sep 2018 02:13:08 GMT]


  • 我目前被問過最喜歡的面試題是, "當你在瀏覽器網址欄上輸入 google.com , 然後按下 <Enter>後, 接下來會發生甚麼事?"
  • 有些人可能說上好幾天, 試著要回答完整. 但他們到底能講到多深入呢? 我今天要在這裡回答, 單純好玩性質. 當時真的被問到的時候, 我天馬行空說了10分鐘, 直到被對方阻止才停.

所以, 到底會發生甚麼事?

  • 瀏覽器會先開始分析輸入字. 通常如果有帶 .com, 它不會認為你是在搜尋關鍵字. 然後一旦決定這一定是網址的時候, 會檢查有沒有 方案(scheme), 如果沒有, 就在開頭加上 http://. 然後因為你沒有指定 http 協定中的屬性值, 會認定一些設定值以預設值帶入, 像是 port 號 80, 使用 Get, 沒有基本驗證等.
  • 然後會建立一個 http 請求, 然後送出. DNS 會查 google.com, 如果還沒有被存進 cache 過, DNS 會回覆一串 IP 位址(因為 google.com 不會只有一組 IP 位址), 瀏覽器則會預設選第一組.
  • 所以 http 請求會從一個結點跳到另一個結點, 直到它到 google.com 之前 負載平衡(load balancer) 的 IP 位址. 這段不會很久, Google 會回覆你, 要使用 https - 認定為 301 永久重導向(permanent redirect). 它就會沿著相同的路回到瀏覽器, 瀏覽器會自動改成 https, 用預設 443 port 重送. 這次的 TLS(Transport Layer Security) 過程就會直接改由 瀏覽器負載平衡 的連線取代. 而這次的請求會詢問 Google 支援哪個協定(TLS 1.0, 1.1, 1.2), Google 會回覆 1.2. 然後就以 TLS 加密送出.
  • Google 會將請求, 透過網站防火牆規則放到負載平衡上, 是要確認是否為惡意請求. 當都通過, 安全連線就終止了(因為 PCI-DSS 法規說你不需要在 內部 溝通時加密), 然後請求會被分配到 CDN 的 pool(請求池), google 這邊的 cache 首頁就會以 http 回覆.
  • 瀏覽器讀取 Google 回覆的 header, 並根據 header 的 caching policy 存 cache, 然後 body 才會 un-gzipped. 因為它是 google, 會用最優化的方式處理: minified. 但這次的請求會觸發一連串其它請求, 不過因為是 http/2, 所以會同時都發出. 當這些請求發出時, 會開始解析 JavaScript.
  • 瀏覽器可能已經出現搜尋框, 正在處理 google.com 上面一排的工具列, 所以還要額外的請求
    • 已經有 cookie 或是 local storage 帶著 OAuth token
    • 若當時用的是 Chrome, 它就已經知道我是誰了, 然後這個驗證的請求送到他們的 Google+ API, 再通知 Google 搜尋頁面我是誰.
  • 可能有另一個請求會送出, 要取得我的大頭貼. 這時, 知道我過去都不是用 Chrome, 可能就會跳出一個提示視窗要我把預設瀏覽器改成 Chrome.

以下省略

ChaoLiou avatar Nov 05 '18 02:11 ChaoLiou