首頁 >web前端 >js教程 >5m 初學者如何使用網絡

5m 初學者如何使用網絡

Barbara Streisand
Barbara Streisand原創
2024-12-08 18:54:14565瀏覽

How the web works for beginners in 5m
您將了解在電腦或手機上的網路瀏覽器中查看網頁時所發生情況的簡化視圖。

客戶端和伺服器

連接到網際網路的電腦稱為客戶端伺服器。簡化版

How the web works for beginners in 5m

  • 用戶端是典型網路使用者的網路連線裝置(例如,連接到 Wi-Fi 的電腦)以及這些裝置上可用的網路存取軟體(通常是 Chrome 等網路瀏覽器)。
  • 伺服器是儲存網頁、網站或應用程式的電腦。當客戶端設備想要存取網頁時,網頁的副本將從伺服器下載到客戶端電腦上,以顯示在使用者的網頁瀏覽器中。

除了客戶端和服務端之外,我們還需要向以下物件打招呼:

  • 您的網路連線:讓您在網路上傳送和接收資料。

  • TCP/IP:傳輸控制協定和網際網路協定是定義資料如何在網際網路上傳輸的通訊協定。

  • DNS:網域名稱系統就像是網站的通訊錄。當您在瀏覽器中鍵入網址時,瀏覽器會在檢索網站之前查看 DNS 以尋找網站的 IP 位址。瀏覽器需要找出網站所在的伺服器,以便它可以將 HTTP 訊息傳送到正確的位置(請參閱下文)。

  • HTTP:超文本傳輸協定是一種應用程式協議,定義客戶端和伺服器相互通訊的語言。

  • 元件檔:網站由許多不同的文件組成,這些文件主要有兩種類型:

    • 程式碼檔案:網站主要由 HTML、CSS 和 JavaScript 建構。
    • 資產:這是構成網站的所有其他內容的統稱,例如圖像、音樂、影片、Word 文件和 PDF。

當您在瀏覽器中輸入網址時

  1. 瀏覽器前往DNS伺服器,找到網站所在伺服器的真實位址
  2. 瀏覽器向伺服器傳送 HTTP 請求訊息,要求伺服器傳送網站的副本給客戶端。此訊息以及用戶端和伺服器之間發送的所有其他資料均使用 TCP/IP 透過網際網路連線傳送。
  3. 如果伺服器批准了客戶端的請求,伺服器會向客戶端發送“200 OK”訊息,這意味著“當然你可以查看該網站!就是這裡”,然後開始將網站的檔案傳送到瀏覽器作為一系列稱為資料包的小塊
  4. 瀏覽器將這些小塊組裝成一個完整的網頁並顯示給您。

檔案解析順序

  • HTML 解析:瀏覽器先解析 HTML 文件,偵測 外部 CSS 和 <script> 標籤JavaScript 標籤。 </script>

  • 取得 CSS 和 JavaScript:解析 HTML 時,瀏覽器會向伺服器發送請求以取得引用的 CSS 和 JavaScript 檔案。

  • 解析與編譯:

    • HTML 產生 DOM 樹(文件物件模型)。
    • CSS 產生 CSSOM 樹(CSS 物件模型)。
    • JavaScript 被編譯並執行。
  • 頁面渲染:瀏覽器結合 DOM 和 CSSOM 來設計內容並執行 JavaScript,將頁面的視覺表示繪製到螢幕上,允許使用者互動。

什麼是 DNS(網域名稱系統)?

真實的網址並不是您在網址列中輸入的漂亮、令人難忘的字串來尋找您最喜愛的網站。它們是特殊的數字,如下所示:192.0.2.172。

這稱為 IP 位址,它代表網路上的唯一位置。然而,它並不容易記住,不是嗎?這就是發明域名系統的原因。本系統使用特殊伺服器將您在瀏覽器中輸入的網址(例如「mozilla.org」)與網站的真實(IP)位址進行配對。

資源:

  • MDN 網路文件

以上是5m 初學者如何使用網絡的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn