前端：每天5道面试题（游览器）

1. 浏览器中输入 url 后发生了什么

1. url 解析

• 用户输入的 URL（统一资源定位符）会被解析为协议类型、域名、端口号和路径等部分。
• 检查域名是否合法可以通过正则表达式或者常见的域名验证规则进行判断。

2. dns 解析

• 浏览器进行 DNS 查询，将域名转换为 IP 地址。
• 浏览器会首先检查本地缓存是否有对应域名的 IP 地址，如果没有则向 DNS 服务器发起查询请求。

在 DNS 解析中，涉及到两种缓存机制：强缓存和协商缓存，它们都对提高网络性能和减少网络负载起着重要作用。

1. 强缓存：
   原理：当浏览器第一次请求某个资源时，服务器会返回该资源的响应头中包含缓存控制字段（如 Cache-Control、Expires），告诉浏览器该资源的缓存策略。如果资源可以被强缓存，浏览器会将该资源缓存在本地，并在下次请求时直接从本地缓存中获取，而不需要与服务器通信。
   优点：减少了网络延迟和带宽消耗，加快了页面加载速度。
   缺点：可能导致浏览器无法获得最新版本的资源，需要等待缓存过期或手动刷新才能获取最新资源。

2. 协商缓存：
   原理：当资源过期或者浏览器缓存失效时，浏览器会向服务器发送一个验证请求，询问该资源在服务器上是否有更新。服务器会根据资源的 ETag 或 Last-Modified 等字段判断资源是否有更新，然后返回 304 Not Modified 状态码或新的资源给浏览器。
   优点：可以保证浏览器始终获取到最新版本的资源。
   缺点：每次请求都需要与服务器通信，增加了网络负载。

   DNS 解析过程：

   浏览器缓存：首先浏览器会检查自身的缓存，看是否已经解析过该域名，如果有，则直接使用缓存的 IP 地址。

   操作系统缓存：如果浏览器缓存中没有找到，会检查操作系统的 hosts 文件以及本地 DNS 缓存，看是否有对应的解析记录。

   查询本地 DNS 服务器：如果以上缓存都没有找到，会向本地 DNS 服务器发送查询请求，本地 DNS 服务器会递归查询，向根域名服务器、顶级域名服务器、权威域名服务器依次查询，最终获取到目标域名对应的 IP 地址。解析结果返回：本地 DNS 服务器将解析结果返回给浏览器，浏览器将结果缓存，并开始建立 TCP 连接请求目标服务器。

   通过强缓存和协商缓存机制，可以有效减少不必要的网络请求，提高网站的加载速度和用户体验。同时，在 DNS 解析过程中，通过多级缓存和查询，可以快速且准确地将域名解析为 IP 地址，实现网络通信的可靠性和稳定性。

3. tcp 连接 三次握手

   浏览器与服务器建立 TCP 连接，进行三次握手以确认连接的可靠性

   三次握手（TCP 连接建立过程）：
   

   1. 客户端发送 SYN（同步）报文
   2. 服务器回复 SYN-ACK 报文
   3. 客户端发送 ACK 报文

4. 发起 HTTP 请求

浏览器向服务器发送 HTTP 请求，请求相应资源（如 HTML 文件、CSS 文件、JavaScript 文件、图片等）。

5. 接收响应解析 html

服务器接收到请求后，返回相应资源的数据。浏览器接收到响应后开始解析 HTML 内容

6. 渲染页面

   1. 解析 HTML，构建 DOM 树：浏览器解析 HTML 文档，将其转换为 DOM（文档对象模型）树结构。
   2. 解析 CSS，生成 CSS 规则树：浏览器解析 CSS 样式表，构建 CSS 规则树。
   3. 合并 DOM 树和 CSS 规则，生成 render 树：将 DOM 树和 CSS 规则树结合，构建渲染树（render 树）。
   4. 布局和绘制页面：浏览器根据渲染树进行布局（确定元素大小和位置）和绘制（将元素呈现到屏幕上）。

7. 断开 tcp 连接 四次挥手
   四次挥手（TCP 连接断开过程）：

1. 客户端发送 FIN 报文
2. 服务器回复 ACK 报文
3. 服务器发送 FIN 报文
4. 客户端回复 ACK 报文

2. https 与 http 的区别

特征	HTTP	HTTPS
默认端口	80	443
数据传输方式	明文传输	加密传输
加密方式	不加密	使用 SSL/TLS 协议进行加密传输
安全性	数据传输不安全，容易被窃听和篡改	数据传输经过加密，安全性更高
认证方式	不提供身份验证，容易遭受中间人攻击	通过 SSL 证书对服务器和客户端进行身份验证
SEO 影响	没有加密的网站可能在搜索引擎排名中受到惩罚	加密网站可能获得更好的搜索引擎排名
速度	比 HTTPS 快，因为不需要加密和解密操作	比 HTTP 稍慢，因为需要加密和解密操作
证书	不需要购买，免费提供	需要购买，需要向 CA（证书颁发机构）申请和支付费用

3. cookie、sessionstorage、localstorage 的区别？

特征	Cookie	SessionStorage	LocalStorage
存储位置	存储在客户端和服务器端	仅存储在客户端	仅存储在客户端
数据传输	每次 HTTP 请求中都会携带，影响性能和安全性	仅在当前会话中可用，不随每次请求发送到服务器	永久保存在客户端，不随每次请求发送到服务器
大小限制	最多存储 4KB 的数据	可以存储 5MB 左右的数据	可以存储 5MB 左右的数据
数据存活时间	可设置过期时间，可以是会话级或长期存储	页面关闭后数据消失，仅在当前会话中有效	永久存储，除非用户清除缓存或网站删除数据

4. 谈一谈 TCP 和 UDP 的区别？

连接性	面向连接	无连接
可靠性	提供可靠的数据传输，保证数据按序到达且无差错	不保证可靠性，数据传输可能丢失或乱序
速度	相对较慢，因为有连接建立和维护的开销	相对较快，没有连接建立和维护的开销
传输方式	面向字节流	面向报文
数据包大小	没有固定大小限制，支持大数据传输	有固定大小限制，每个数据包最大长度为 64KB
请求头大小	因为要实现可靠的链接	因为快速、无连接的通信
拥塞控制	提供拥塞控制机制，根据网络状况调整发送速率	没有拥塞控制机制，发送速率高于网络负载会导致丢包
适用场景	适用于可靠性要求高、数据传输量大的应用（如文件传输、网页加载）	适用于实时性要求高、速度优先的应用（如音视频通信、游戏）

5. 说一说 HTTP 状态码？

1xx（信息性状态码） ：表示接收的请求正在处理。

• 100：表示客户端应继续发送其余的请求内容。
• 101：表示客户端应切换协议。

2xx（成功状态码） ：表示请求已成功被服务器接收，通常用于发送请求后，服务器端的处理结果。

• 200：表示请求已成功被服务器接收，通常用于发送请求后，服务器端的处理结果。
• 201：表示请求成功并且创建了新的资源
• 202：表示服务端请求成功没有处理请求

3xx（重定向状态码） ：表示请求的资源已被移动或临时性地不可用，需要客户端执行额外的操作才能继续访问该资源。

• 301：永久重定向，表示请求的资源已被永久地移动到新的位置，客户端应当使用 GET 请求的新位置。
• 302：临时重定向，表示请求的资源已被临时地移动到新的位置，客户端应当使用 GET 请求的新位置。

4xx（客户端错误状态码） ：表示客户端的错误，服务器无法处理请求。

• 400：请求的语法错误，服务器无法理解，客户端应使用正确的语法。
• 401：未授权，表示用户没有权限（令牌、用户名、密码错误）。
• 403：禁止，表示用户得到服务器的响应，但是服务器仍然拒绝用户访问，例如用户没有权限（令牌、用户名、密码错误）。
• 404：未找到，表示服务器无法找到请求的资源，通常因为服务器无法找到请求的网页。
• 405：方法未允许，表示客户端请求的方法不被允许。
• 406：不支持的格式，表示客户端请求的格式不支持，服务器无法处理。

5xx（服务器错误状态码） ：表示服务器的错误，无法处理客户端的请求。

• 500：服务器内部错误，服务器遇到错误时返回的错误代码。
• 501：未实现，表示服务器未实现该功能，服务器未完成请求。
• 502：网关错误，表示服务器作为网关或者代理，从上游服务器收到了无效的响应。
• 503：服务不可用，表示服务器当前无法提供服务，可以尝试稍后再试。
• 504：网关超时，表示服务器作为网关或者代理，未及时从上游服务器接收请求。
• 505：HTTP 版本不支持，表示服务器不支持请求的 HTTP 协议版本。