[System Design] 當你訪問www.google.com的時候發生了什麼？

當你訪問www.google.com的時候發生了什麼？

個人瀏覽器端：

1. www.google.com會自動補全爲http://www.google.com/,這是個url,他表示網絡某個資源(resource)的位置, 通常格式爲: protocol :// hostname[:port] / path / ;parameters#fragment

2. 瀏覽器拿着這個domain找離你最近的DNS，DNS是網絡運營商(電信,聯通,移動,verizon,comcast)提供的。DNS服務器返回給我一個IP地址.

3. 瀏覽器向這個IP地址發送一個http/https Request,google的服務器處理這個請求以後返回對應的Response，是一個html文件，瀏覽器將html文件顯示.

Google的服務器端：

1. Google的Web Server(硬件)收到request，將這個request遞交給正在80端口監聽的HTTP Server(跑在Web Server上的軟件，常見的有Nginx,Apache,Unicorn,Gunicorn等)，80端口是專爲http開放的，端口號用來區分這臺主機提供的不一樣服務，由TCP/IP協議棧規定.

2. HTTP拿到request後轉發給Web Application(咱們寫的程序)，常見框架:Django(Python),Ruby on Rails(Ruby),NodeJS(JS),Dropwizard(Java).

3. 咱們把寫好的html+css+js經過http協議發回給瀏覽器，瀏覽器顯示並運行這些文件，以此頁面爲出發點，開始後續的交互.

後續的交互，再也不須要瀏覽器的地址輸入框了。咱們常說的前端和後端，都是程序，前端的程序運行在瀏覽器裏，後端的程序運行在google的服務器裏。當前流行的趨勢是，先後端經過AJAX(Asynchronous JavaScript and XML)傳遞信息。咱們在google給咱們的這個網頁上再點別的連接，都是經過頁面裏的JavaScript向後端發送http請求。AJAX雖然X表明XML，但目前數據格式的傳輸主要以JSON爲主了。相應的，後端也要具有接收和發送JSON/XML請求的能力，實現這個通常有兩種架構：REST和SOAP,目前REST已是最爲流行的架構。

參考：
What-happens-when-you-type-a-URL-in-browser
How does a frontend code and a backend code interact with each other?
九章系統設計