【高頻】從輸入URL到頁面展示到底發生了什么?

一、相關衍生面試問題:

瀏覽器輸入美團網站,從回車到瀏覽器展示經歷了哪些過程 ?

http輸入網頁之后的流程?

百度搜索頁面,從點開搜索框,到顯示搜索頁面經歷了什么?

二、探究各個過程:

(以下回答針對問題1回答)

1. DNS 解析

  • 瀏覽器首先會檢查本地 DNS 緩存,看是否有美團網站的 IP 地址。如果沒有,則會向本地 DNS 服務器發送請求,查詢美團網站的域名對應的 IP 地址。
  • 本地 DNS 服務器可能無法直接找到美團網站的 IP 地址,它會向根域名服務器發送請求,根域名服務器會指引本地 DNS 服務器去查詢 .com 域名的頂級域名服務器。
  • 頂級域名服務器會指引本地 DNS 服務器去查詢美團網站的域名服務器。
  • 美團網站的域名服務器會最終返回美團網站的 IP 地址給本地 DNS 服務器。
  • 本地 DNS 服務器將 IP 地址返回給瀏覽器,并將其緩存起來。

【涉及到的相關知識:

1.DNS緩存:存儲近期瀏覽、連接過的網站服務器的IP用的一個緩存系統。瀏覽器會盡可能利用緩存來提高性能,減少不必要的網絡請求和DNS解析。

2.域名服務器:根域名服務器、頂級域名服務器(org\com\edu)、權限域名服務器、本地域名服務器[迭代查詢(常用) | | 遞歸查詢]。

3.DNS解析:用來把便于人們記憶的主機域名和電子郵件地址映射為計算機易于識別的IP地址。

2. 建立 TCP 連接

  • 瀏覽器使用獲得的 IP 地址,嘗試與美團網站的服務器建立 TCP 連接。
  • 瀏覽器會發送一個 SYN 包(同步請求)到服務器,服務器收到后會回復一個 SYN-ACK 包(同步確認)。
  • 瀏覽器收到 SYN-ACK 包后,會發送一個 ACK 包(確認),完成三次握手過程,建立 TCP 連接。

【相關知識點:

1.三次握手的原因:首要原因是為了防止舊的重復連接初始化造成混亂,最主要原因就是防止「歷史連接」初始化了連接

2.每次建立 TCP 連接時,初始化的序列號都要求不一樣:為了防止歷史報文被下一個相同四元組的連接接收(主要方面);為了安全性,防止黑客偽造的相同序列號的 TCP 報文被對方接收。

3.SYN攻擊屬于DDoS攻擊的一種,它利用TCP協議缺陷,通過發送大量的半連接請求,耗費CPU和內存資源。【最直接的表現就會把 TCP 半連接隊列打滿,這樣當 TCP 半連接隊列滿了,后續再在收到 SYN 報文就會丟棄,導致客戶端無法和服務端建立連接。】

  • 半連接隊列,也稱 SYN 隊列;
  • 全連接隊列,也稱 accept 隊列;

4.避免辦法:

  • 調大 netdev_max_backlog;
  • 增大 TCP 半連接隊列;
  • 開啟 tcp_syncookies;
  • 減少 SYN+ACK 重傳次數

3. 發送 HTTP 請求

  • 瀏覽器向美團網站的服務器發送一個 HTTP 請求,包含以下信息:
    • 請求方法:GET
    • 請求 URL:美團網站的首頁地址
    • 請求頭:包含一些瀏覽器信息、語言信息、Cookie 信息等。
  • 服務器收到請求后,會根據請求信息進行處理。

【相關知識點:

1.post、get、put、delete就是對這個資源進行增、刪、改、查的操作!

2.URI 用字符串標識某一互聯網資源【身份證號】,而 URL 表示資源的地點【居住地址】

3.Cookie為“小型文本文件”,是某些網站為了辨別用戶身份,進行Session跟蹤而儲存在用戶本地終端上的數據(通常經過加密),由用戶客戶端計算機暫時或永久保存的信息

4. 服務器處理請求

  • 服務器會根據請求 URL,找到對應的頁面文件。
  • 服務器會根據頁面文件的內容,生成 HTML 代碼。
  • 服務器會根據請求頭中的 Cookie 信息,判斷用戶是否已登錄,并根據用戶狀態,添加一些個性化的內容到 HTML 代碼中。
  • 服務器會根據請求頭中的語言信息,選擇合適的語言版本。

【相關知識點:

1.跨站請求偽造(Cross-Site Request Forgery,簡稱CSRF)是指,攻擊者可能利用網頁中的惡意代碼強迫受害者瀏覽器向被攻擊的Web站點發送偽造的請求,篡奪受害者的認證Cookie等身份信息,從而假冒受害者對目標站點執行指定的操作。

2.保護措施主要有:(1 )加入MAC以進行完整性校驗;(2)防止非法用戶非法截獲后的重放,可以讓用戶對相關信息進行數字簽名,加強有效性驗證;(3)對Cookie本身進行隨機密鑰加密,保證Cookie本身的信息安全。

5. 服務器返回響應

  • 服務器將生成的 HTML 代碼,以及一些其他信息(例如圖片、CSS、JavaScript 文件等),打包成 HTTP 響應,發送回瀏覽器。
  • 響應頭包含一些狀態碼、內容類型、緩存信息等。

6. 瀏覽器解析響應

  • 瀏覽器收到響應后,會解析響應頭中的狀態碼。
    • 如果狀態碼為 200,表示請求成功,瀏覽器會繼續解析響應內容。
    • 如果狀態碼為 404,表示頁面未找到,瀏覽器會顯示錯誤頁面。
  • 瀏覽器會解析響應內容中的 HTML 代碼,并將其渲染成網頁。
  • 瀏覽器會加載響應內容中的圖片、CSS、JavaScript 文件,并將其應用到網頁中。

【相關知識點:

  • 1xx(信息性狀態碼):表示接收的請求正在處理。
  • 2xx(成功狀態碼):表示請求正常處理完畢。
  • 3xx(重定向狀態碼):需要后續操作才能完成這一請求。
  • 4xx(客戶端錯誤狀態碼):表示請求包含語法錯誤或無法完成。
  • 5xx(服務器錯誤狀態碼):服務器在處理請求的過程中發生了錯誤。

7. 網頁展示

  • 瀏覽器將渲染好的網頁展示給用戶。

8. 持續交互

  • 用戶在網頁上進行操作,例如點擊鏈接、提交表單等,瀏覽器會發送新的 HTTP 請求到服務器,服務器會根據請求進行處理,并返回新的響應,瀏覽器會繼續更新網頁內容。

三、面試回答:

  1. 用戶在瀏覽器地址欄輸入"meituan.com"并按下回車鍵。

  2. 瀏覽器首先會查看自己的緩存,看是否之前已經訪問過這個網站并緩存了相關資源。如果緩存中有相關的資源,瀏覽器就可以直接使用緩存中的內容,無需進行其他操作。

  3. 如果緩存中沒有找到所需的資源,瀏覽器就需要進行DNS解析,查找"meituan.com"對應的IP地址。這個過程中,瀏覽器會先查看本地DNS緩存,如果沒有找到就會向DNS服務器發起查詢請求。

  4. 獲得IP地址后,瀏覽器會向該IP地址發起HTTP請求,向web服務器請求獲取"meituan.com"網頁的內容。

  5. web服務器收到請求后,會處理并生成相應的HTML頁面內容,然后將其返回給瀏覽器。

  6. 瀏覽器收到HTML頁面內容后,會對其進行解析和渲染,構建出網頁的DOM樹并顯示出來。

  7. 在渲染網頁的過程中,還可能需要加載額外的資源,如CSS文件、JavaScript文件、圖片等。對于這些資源,瀏覽器也會遵循之前的流程,先檢查緩存,再進行DNS解析和網絡請求。

  8. 當所有必需的資源都加載完畢后,瀏覽器就能將完整的網頁呈現給用戶。

【下圖為代碼隨想錄推薦回答:】

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/14632.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/14632.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/14632.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

XML Schema 字符串數據類型及約束詳解

字符串數據類型用于包含字符字符串的值。字符串數據類型可以包含字符、換行符、回車符和制表符。 以下是模式中字符串聲明的示例&#xff1a; <xs:element name"customer" type"xs:string"/>您文檔中的一個元素可能如下所示&#xff1a; <custo…

maven--解決Idea沒有拉取SNAPSHOT的問題

原文網址&#xff1a;maven--解決Idea沒有拉取SNAPSHOT的問題_IT利刃出鞘的博客-CSDN博客 簡介 本文介紹Idea解決maven沒有拉取SNAPSHOT的問題。 問題描述 項目依賴了以-SNAPSHOT結尾的包&#xff0c;它更新了。Idea點了重新導入后沒有拉取到最新的包&#xff1a; 解決方案…

什么是分賬系統呢?云分帳系統的實現功能有哪些?

隨著電商平臺的發展&#xff0c;越來越多的商家開始通過在線平臺進行銷售&#xff0c;平臺業務場景的逐漸復雜&#xff0c;多渠道收款、多方分賬。在些場景下如何解決這些問題成為電商平臺急需解決的核心問題。 為了解決這些問題&#xff0c;電商平臺可以引入分賬系統即可輕松解…

從“圖形可視化”到“圖生代碼”,低代碼平臺的新挑戰

前言&#xff1a; 低代碼平臺最大的一個特點就是可視化&#xff0c;將代碼采用可視化的方式展示管理。一時間擁有圖形化界面的各類系統都掛上了低代碼的標簽。但更多的代碼從業者在使用中卻發現&#xff0c;在眾多的低代碼平臺中都是“別人家的代碼”其可視化主要是別人家的代…

如何解決vcruntime140.dll丟失問題,詳細介紹5種靠譜的解決方法

vcruntime140.dll是Microsoft Visual C Redistributable Package的一部分&#xff0c;它為使用Visual C編譯器開發的應用程序提供必要的運行時環境。該DLL文件包含了大量應用程序運行時需要調用的庫函數&#xff0c;這些函數是實現C標準庫、異常處理機制、RTTI&#xff08;運行…

圖搜索算法教程(個人總結版)

圖搜索算法是一類用于遍歷或搜索圖結構的算法&#xff0c;廣泛應用于網絡分析、路徑規劃、人工智能等領域。常見的圖搜索算法包括深度優先搜索&#xff08;DFS&#xff09;、廣度優先搜索&#xff08;BFS&#xff09;、Dijkstra算法、A*算法等。本文將詳細介紹這些圖搜索算法的…

創建JSON數據包

在C語言中&#xff0c;JSON不是一種內置的數據類型&#xff0c;因此你需要使用第三方庫來創建和解析JSON數據。一個流行的庫是cJSON&#xff0c;它允許你以C語言的方式操作JSON數據。 以下是一個使用cJSON庫創建類似于你給出的JSON數據包的示例&#xff1a; 首先&#xff0c;…

go-zero 實戰(5)

引入Prometheus 用 Prometheus 監控應用 1. 用 docker 啟動 Prometheus 編輯配置位置&#xff0c;我將 prometheus.yaml 和 targets.json 文件放在了 /opt/prometheus/conf目錄下 prometheus.yaml global:scrape_interval: 15s # 抓取間隔evaluation_interval: 15s # 評估…

【代碼隨想錄 二叉樹】二叉樹前序、中序、后序遍歷的迭代遍歷

文章目錄 1. 二叉樹前序遍歷&#xff08;迭代法&#xff09;2. 二叉樹后序遍歷&#xff08;迭代法&#xff09;3. 二叉樹中序遍歷&#xff08;迭代法&#xff09; 1. 二叉樹前序遍歷&#xff08;迭代法&#xff09; 題目連接 &#x1f34e;因為處理順序和訪問順序是一致的。所…

前端工程化-babel、corejs、postcss

出處&#xff1a;前端工程化-babel、corejs、postcss | 劉維_個人博客_編程秘籍_開發技巧_入門到精通_生活感悟 (ldlw.site) 一. babel和corejs的作用到底是什么 腦子里面的想法 es6 -> es5 es6里面其實有兩種東西 語法 新特性 轉的語法 const a 1 const b &#xf…

Shader GLSL 3D旋轉函數

mat4 rotationMatrix(vec3 axis, float angle) {axis = normalize(axis);float s = sin(angle);float c = cos(angle)

類和對象的基本概念

類和對象的基本概念 C和C中struct區別類的封裝封裝訪問權限總結struct和class的區別 將成員變量設置為private C和C中struct區別 C語言struct只有變量C語言struct 既有變量&#xff0c;也有函數 類的封裝 封裝 把變量&#xff08;屬性&#xff09;和函數&#xff08;操作&a…

交換機部分綜合實驗

實驗要求 1.內網IP地址使用172.16.0.0/16 2.sw1和sW2之間互為備份; 3.VRRP/mstp/vlan/eth-trunk均使用; 4.所有pc均通過DHcP獲取Ip地址; 5.ISP只配置IP地址; 6.所有電腦可以正常訪問IsP路由器環回 實驗拓撲 實驗思路 1.給交換機創建vlan&#xff0c;并將接口劃入vlan 2.在SW1和…

Unity Render Streaming 云渲染 外網訪問

初版&#xff1a; 日期&#xff1a;2024.5.20 前言&#xff1a;臨時思路整理&#xff0c;后期會詳細補充 環境&#xff1a; 1. 阿里云服務器 需要安裝好nodejs 、npm 2. windows電腦&#xff0c;需安裝好 nodejs 、npm 3.Unity 2021.3.15f1 4.Unity Render Streaming …

31.GDB介紹及簡單使用

文章目錄 基本用法查看匯編代碼Text User Interface(TUI)refernece 歡迎訪問個人網絡日志&#x1f339;&#x1f339;知行空間&#x1f339;&#x1f339; GDB 是 GNU Debugger的縮寫&#xff0c;是GNU軟件系統中的標準調試器&#xff0c; 很多類UNIX系統都可以使用GDB&#xf…

【論文解讀】Overview of the Scalable Video Coding Extension of the H.264/AVC Standard

介紹 該篇論文是一篇關于H.264/AVC標準可擴展視頻編碼(SVC)擴展的綜述論文,由Heiko Schwarz、Detlev Marpe和Thomas Wiegand撰寫,發表在《IEEE Transactions on Circuits and Systems for Video Technology》2007年9月第17卷第9期上。 論文解讀 摘要: H.264/AVC視頻編…

鄉村振興的農業供給側結構性改革:優化農業產業結構,提升農產品質量,滿足市場需求,實現美麗鄉村產業振興

一、引言 鄉村振興戰略是我國當前及未來一段時間內的重大戰略部署&#xff0c;旨在推動農業農村現代化&#xff0c;實現城鄉融合發展。在鄉村振興戰略中&#xff0c;農業供給側結構性改革是核心任務之一。通過優化農業產業結構、提升農產品質量、滿足市場需求&#xff0c;不僅…

韓國云主機遠程故障怎么排查?

韓國云主機遠程故障可能是由于多種原因引起的&#xff0c;包括網絡問題、服務器故障、安全設置、客戶端問題等。下面是針對韓國云主機遠程故障的排查步驟和解決方法&#xff1a; 檢查網絡連接 1.使用 ping 命令 在本地計算機上使用 ping 命令檢查與云主機之間的網絡連接。如果無…

AI巨頭爭相與Reddit合作:為何一個古老的論壇成為AI訓練的“寶藏”?

每周跟蹤AI熱點新聞動向和震撼發展 想要探索生成式人工智能的前沿進展嗎&#xff1f;訂閱我們的簡報&#xff0c;深入解析最新的技術突破、實際應用案例和未來的趨勢。與全球數同行一同&#xff0c;從行業內部的深度分析和實用指南中受益。不要錯過這個機會&#xff0c;成為AI領…

debian nginx upsync consul 實現動態負載

1. consul 安裝 wget -O- https://apt.releases.hashicorp.com/gpg | sudo gpg --dearmor -o /usr/share/keyrings/hashicorp-archive-keyring.gpg echo "deb [signed-by/usr/share/keyrings/hashicorp-archive-keyring.gpg] https://apt.releases.hashicorp.com $(lsb_r…