迎来到"前端就业加油站"，我是您的面试官，我将为您提供专业的就业指导，帮助您快速获得高薪工作的目标。接下来请回答我：在浏览器地址栏输入一个URL网址后回车，到网页显示经历了哪些过程？您好面试官此过程经历http请求的过程和页面内容加载渲染的过程。

（Domain Name Server域名服务器）1.DNS解析：当用户在浏览器中输入URL时，浏览器首先查找本地缓存中是否存储了该URL对应的IP地址。如果没有找到，浏览器会向本地DNS服务器发送DNS查询请求，本地DNS服务器检查自身缓存，如果也没有记录，它会向其他DNS服务器发起查询，直到找到对应的IP地址为止。一旦找到IP地址，本地DNS服务器将其返回给浏览器。

2.建立TCP连接：获得服务器的IP地址后，浏览器会向此IP地址发送一个TCP连接请求。在建立TCP连接之前，浏览器会与服务器进行三次握手，确保连接的可靠性。

3.发送HTTP请求：TCP连接成功建立后，浏览器会向服务器发送HTTP请求，该请求包括请求方法（GETPOST等）、请求头、请求体等信息，请求头包含了浏览器的相关信息，如用户代理、支持的压缩格式、语言等。

4.服务器处理请求并返回响应：服务器接收到浏览器发送的HTTP请求后，会进行处理并生成一个HTTP响应。响应包括状态码、响应头和响应体，状态码有200、404、500等。

5.接收HTTP响应：一旦浏览器接收到服务器返回的HTTP响应，它会进行解析和处理。首先浏览器解析响应头，以确定响应的类型、编码长度等信息，然后它读取响应体并根据响应类型进行解析。

6.浏览器渲染页面：当浏览器接收到HTTP响应并解析出页面的HTML、CSS和JavaScript代码时，它开始渲染页面。渲染页面的过程包括以下步骤：构建DOM树：浏览器将HTML代码解析成一个节点树，构建文档对象模型（DOM），构建CSSOM树。浏览器将 CSS 代码解析成一个样式规则树，构建CS5对象模型（CSSOM），合并DOM树和CSSOM树。浏览器将DOM树和CSSOM树合并成一个渲染树，包含需要显示的节点和对应的CSS样式、布局和绘制。浏览器通过渲染树来实现页面布局和绘制，计算每个节点在屏幕上的位置和大小并生成位图，最后将位图输出到屏幕上呈现给用户。

·7浏览器会执行JavaScript代码。如果页面包含JavaScript代码，浏览器会在执行它之前先对其进行解析，将其转换为抽象语法树（AST），然后编译或直接执行，以提高执行效率。

执行JavaScript代码时，浏览器会创建一个独立于主线程的JavaScript引擎线程，负责执行JavaScript代码。总的来说，从输入URL到浏览器显示页面的过程非常复杂，包括JavaScript解析、TCP连接、HTTP请求和响应、页面渲染和JavaScript代码执行等多个步骤。

了解这些过程有助于更好地理解Web应用的工作原理，并优化Web应用的性能。

长文创作激励计划#

Hello大家好，我是小米，一个热爱分享技术的IT达人。今天我们一起来聊聊一个大家每天都会用到但可能不太了解的过程：浏览器输入URL之后发生了什么。这是一个从用户输入到浏览器显示页面的完整过程，涉及到很多底层的网络基础知识。今天我们就一起来探究这个神秘的过程！

DNS解析

首先，当你在浏览器地址栏中输入一个URL，比如https://www.example.com，并按下回车键时，浏览器首先要做的事情就是找到这个域名对应的IP地址。这一步骤称为DNS解析。

什么是DNS？

DNS（Domain Name System）是一种分布式数据库，它负责将人类容易记忆的域名（如www.example.com）转换为机器能够理解的IP地址（如192.168.1.1）。就像一个电话簿，你可以通过名字查找到对应的电话号码。

DNS解析的过程

1. 浏览器缓存：浏览器首先会检查自己是否缓存了这个域名对应的IP地址。如果有缓存并且没有过期，就直接使用这个缓存结果。
2. 操作系统缓存：如果浏览器没有缓存，就会查询操作系统的缓存。
3. 路由器缓存：如果操作系统也没有缓存，查询会继续向上，检查路由器的缓存。
4. ISP DNS服务器：如果路由器也没有缓存，浏览器会向ISP（互联网服务提供商）的DNS服务器发起查询。
5. 递归查询：如果ISP的DNS服务器也没有结果，它会进行递归查询，向其他DNS服务器询问，直到找到结果为止。

通过以上步骤，浏览器最终获取到了www.example.com对应的IP地址，比如93.184.216.34。

TCP连接

获取到IP地址后，浏览器需要与服务器建立连接。这里使用的是TCP（Transmission Control Protocol）协议。

三次握手

TCP连接的建立需要经过所谓的“三次握手”过程：

1. 第一次握手：浏览器（客户端）向服务器发送一个SYN（synchronize）请求包，表示希望建立连接。
2. 第二次握手：服务器收到SYN包后，回应一个SYN/ACK包，表示同意建立连接。
3. 第三次握手：客户端收到SYN/ACK包后，再发送一个ACK（acknowledgement）包，确认连接建立。

通过这三次握手，浏览器与服务器之间的TCP连接正式建立。

发送HTTP请求

在TCP连接建立之后，浏览器会发送HTTP请求来获取网页内容。HTTP（HyperText Transfer Protocol）是一种无状态的协议，客户端向服务器发送请求，服务器处理请求后返回响应。

构建HTTP请求

一个典型的HTTP请求包括以下部分：

请求行：包含请求方法（如GET、POST）、请求URL和HTTP版本。

请求头：包含一些描述客户端环境、请求主体等信息的元数据，如User-Agent、Host等。

请求主体：在POST请求中，包含需要发送的数据。

示例HTTP请求

服务器处理请求并返回HTTP报文

服务器接收到HTTP请求后，会进行处理并返回HTTP响应。

服务器处理请求

服务器会根据请求的内容，进行相应的处理操作：

• 静态资源请求：如HTML文件、CSS样式表、图片等，服务器会直接从文件系统中读取并返回。
• 动态资源请求：如使用PHP、Node.js等动态语言生成的内容，服务器会先执行相应的代码，生成内容后再返回。

构建HTTP响应

一个典型的HTTP响应包括以下部分：

• 状态行：包含HTTP版本、状态码（如200表示成功，404表示未找到）和状态描述。
• 响应头：包含一些描述响应内容的元数据，如Content-Type、Content-Length等。
• 响应主体：包含实际的响应数据，如HTML文档、图片等。

示例HTTP响应

浏览器渲染

浏览器接收到服务器返回的HTTP响应后，会进行渲染，将网页内容展示给用户。

渲染过程

1. 解析HTML：浏览器会将HTML解析成DOM（Document Object Model）树。
2. 解析CSS：浏览器会解析CSS，生成CSSOM（CSS Object Model）树。
3. 构建渲染树：将DOM树和CSSOM树结合，构建渲染树。
4. 布局：根据渲染树计算每个节点在屏幕上的位置和大小。
5. 绘制：将渲染树的每个节点绘制到屏幕上。

JavaScript的执行

在解析HTML的过程中，如果遇到JavaScript代码，浏览器会暂停HTML的解析，先执行JavaScript。JavaScript可以修改DOM和CSSOM，因此会影响最终的渲染结果。

END

当所有的资源都加载并渲染完毕后，整个过程就结束了。用户可以看到完整的网页内容，并与之进行交互。

以上就是从你在浏览器输入URL到页面展示的完整过程，是不是非常有趣呢？如果大家对某个步骤还有疑问或者想了解更多的细节，欢迎在评论区留言哦！

我是小米，一个喜欢分享技术的29岁程序员。如果你喜欢我的文章，欢迎关注我的微信公众号“软件求生”，获取更多技术干货！