第八问:在浏览器中输入URL后发生了什么?

本文涉及的产品
云解析 DNS,旗舰版 1个月
全局流量管理 GTM,标准版 1个月
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
简介: 当在浏览器中输入URL并按下回车键时,会经历一系列复杂的过程:1. 用户输入URL;2. DNS解析域名;3. 建立TCP连接;4. 发送HTTP/HTTPS请求;5. 服务器处理请求;6. 浏览器渲染页面;7. 页面展示。每个步骤涉及不同的技术和协议,确保数据的准确传输和页面的正确显示。

第八问:在浏览器中输入URL后发生了什么?

当在浏览器中输入一个URL并按下回车键时,背后会发生一系列复杂的过程,以下是详细的步骤说明。


1. 用户输入 URL

  • 用户输入一个 URL(例如 https://www.example.com)。
  • 浏览器会解析输入,判断是完整的 URL 还是需要补全为默认的协议(如 http://)。

2. DNS 解析

  • 浏览器会将域名(如 www.example.com)转换为 IP 地址。
  • 这个过程包括:
  1. 检查本地缓存。
  2. 检查操作系统的缓存(通过 hosts 文件)。
  3. 查询 DNS 服务器。
  4. 如果 DNS 服务器无法解析,会递归向上一级 DNS 查询直到根域名服务器。


3. 建立 TCP 连接

  • 使用三次握手(TCP Three-way Handshake)建立连接:
  1. 客户端发送 SYN。
  2. 服务器返回 SYN-ACK。
  3. 客户端发送 ACK。

  • 知识点:TCP/IP 协议
  • TCP 确保数据传输的可靠性。
  • 在三次握手中,客户端和服务器确认可以相互通信。

4. 发送 HTTP/HTTPS 请求

  • 浏览器根据 URL 的协议(HTTP 或 HTTPS)发送请求。
  • HTTPS 的额外步骤:
  1. TLS 握手。
  2. 验证证书,生成对称密钥。
  3. 加密通信。

5. 服务器处理请求

  • 服务器接收到请求后,进行以下步骤:
  1. 检查请求的资源(文件、动态页面等)。
  2. 如果是动态页面,调用后端程序(如 PHP、Node.js)。
  3. 返回响应数据。

HTTP 请求示例:

GET /index.html HTTP/1.1

Host: www.example.com

HTTP 响应示例:

HTTP/1.1 200 OK

Content-Type: text/html

Content-Length: 1256


6. 浏览器渲染页面

  1. 解析 HTML
  • HTML 解析生成 DOM 树。
  1. 解析 CSS
  • CSS 解析生成 CSSOM 树。
  1. 合成 Render Tree
  • 将 DOM 和 CSSOM 合并。
  1. 布局与绘制
  • 计算页面元素位置并绘制。


7. 页面展示

  • 浏览器将绘制后的页面呈现在用户面前。
  • 可能还会加载其他资源(图片、视频、JS 等)。

总结表格

步骤 操作 涉及技术/协议
用户输入 URL 判断是否为有效 URL URL、URI
DNS 解析 将域名解析为 IP 地址 DNS 协议、递归查询
TCP 连接 建立与服务器的通信 TCP 三次握手
HTTPS 安全通信 加密通信 TLS/SSL
HTTP 请求与响应 请求资源并接收响应 HTTP/HTTPS 协议
浏览器渲染页面 构建 DOM、CSSOM,绘制页面 HTML、CSS、JavaScript 渲染
目录
相关文章
|
7月前
|
缓存 网络协议 前端开发
当浏览器输入url的时候会发生什么?
当浏览器输入url的时候会发生什么?
102 0
|
5月前
|
缓存 网络协议 前端开发
一步步揭秘:浏览器输入URL后的那些事儿
大家好,我是小米!你有没有好奇过,当你在浏览器输入一个网址并按下回车键后,到底发生了什么神奇的过程?从DNS解析到TCP连接,从发送HTTP请求到浏览器渲染,本文将带你深入了解这个复杂而又迷人的过程,让我们一起探索吧!
62 2
|
4月前
|
缓存 JavaScript 前端开发
浏览器对地址栏中输入的URL的处理过程
【8月更文挑战第20天】
121 0
|
1月前
|
缓存 网络协议 JavaScript
浏览器输入url之后最后网页渲染出来经过了什么
【10月更文挑战第31天】从浏览器输入 URL 到网页渲染出来是一个涉及多个环节和技术的复杂过程,每个环节都对最终的网页显示效果和用户体验有着重要的影响。
28 3
|
1月前
|
存储 缓存 网络协议
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点,GET、POST的区别,Cookie与Session
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点、状态码、报文格式,GET、POST的区别,DNS的解析过程、数字证书、Cookie与Session,对称加密和非对称加密
|
1月前
|
域名解析 缓存 网络协议
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
|
2月前
|
缓存 网络协议 前端开发
浏览器输入一个URL后,发生了什么?
浏览器输入一个URL后,发生了什么?
31 1
|
7月前
|
缓存 负载均衡 网络协议
在浏览器地址栏中输入URL后发生了什么
这是一个关于网页加载过程的概述:首先,浏览器查询IP地址,通过DNS解析域名;接着,建立TCP连接,发起HTTP请求;服务器处理请求并返回HTTP响应;最后,浏览器解析和渲染网页内容。过程中涉及DNS缓存、TCP三次握手、HTTP请求与响应、HTML解析、CSS和JS加载,以及渲染树的构建。为了优化网站性能,可以减少DNS查询、合并文件、压缩资源、提前加载CSS和延迟加载JS。
|
2月前
|
域名解析 缓存 网络协议
浏览器输入 URL 回车后会经历哪些步骤?
本文首发于微信公众号“前端徐徐”,详细解析了从在浏览器中输入URL到页面完全呈现的全过程,涵盖检查缓存、URL解析、DNS解析、TCP连接、HTTP请求、服务器响应、浏览器处理响应、页面解析与渲染、关闭TCP连接等关键步骤。通过这些步骤,帮助读者深入了解互联网的工作原理,提升网站性能和用户体验。
34 0
|
4月前
|
网络协议 前端开发 JavaScript
浏览器加载网页的幕后之旅:从URL到页面展示详解
【8月更文挑战第31天】当在浏览器地址栏输入URL并回车后,一系列复杂过程随即启动,包括DNS解析、TCP连接建立、HTTP请求发送、服务器请求处理及响应返回,最后是浏览器页面渲染。这一流程涉及网络通信、服务器处理和客户端渲染等多个环节。通过示例代码,本文详细解释了每个步骤,帮助读者深入理解Web应用程序的工作机制,从而在开发过程中作出更优决策。
74 5