前後端構架基礎概念


Posted by yunanpan on 2020-06-15

以生活中寄收信的過程說明當使用網頁送出表單或是造訪一個網址,到網頁畫面呈現出來之間發生什麼事的概念:


今天小藍想要寄出一封信給遠在雲端的小黃,將信投進了郵筒。騎著機車的郵差先是將信收到了郵局,再向海關辦理出口郵件報關手續。但在此時郵差發現小藍在收件人的地方只寫了小黃的名字,卻忘記寫地址了!幸好在海關辦理出口郵件的地方有個叫做 DNS さん的人,只要你報名字,他就會告訴你收件人地址。他告訴郵差小黃的地址是 5.4.8.7,於是信件平安無事的抵達了小黃手中。收到信的小黃會將信件收到倉庫一號裡,看看倉庫有沒有可以用的東西後,便著手回覆信件。小黃不同於忘記寫地址、粗心大意的小藍,還會再另外將放進倉庫一號的東西備份到倉庫二號,以防範倉庫一號爆炸,一夕燒毀一切。而回覆的信件則再次經過海關處、郵局後回到了小藍眼前,打開發現是分手信,心碎了滿屏。

將上述出現在寄收信故事中的人物與地點對應到網頁背後的運作,再拆解步驟的話,就可以說明從造訪網頁到網頁呈現中間發生了什麼事。
小藍就是使用者,郵筒就像是瀏覽器,郵局及海關則是電腦作業系統與硬體。小黃所在的地址則是網頁 server 的 IP 位置,倉庫為存取資料的 database。

  1. 使用者透過瀏覽器發送請求,會先通過電腦作業系統與硬體 (網卡)將 request 送出
  2. 透過 DNS 得知 server 的 IP 位置,將 request 送到得知的 IP 位置
  3. server 收到 request,將資料存取至 database 並取得相關資料
  4. server 回傳 responese 給硬體、作業系統解析最終呈現在瀏覽器上

至於為什麼需要將域名(Domain)轉成 IP 位置,是因為電腦溝通時是使用 IP 位置,所以在向 server 發送 request 前,需先透過 DNS(Domain Name System)將域名轉換成 IP 位置。
而 IP 位置主要由四組位於 0~255 之間的數字所組成。每個主機都會有一個 IP 位置。










Related Posts

Day 61 - Flask WTF & Bootstrap [Hard]

Day 61 - Flask WTF & Bootstrap [Hard]

Robotframework框架介紹

Robotframework框架介紹

JavaScript - 對 Closure 閉包的初步理解

JavaScript - 對 Closure 閉包的初步理解


Comments