《2024前端面试必刷-http篇精简版》

概_前端
166 阅读7分钟

这篇文章将会用较小的篇幅，讲清楚关于http的面试常考点（常见的HTTP Header及其功能、常见的状态码、关于缓存等）。

常见的HTTP Header及其功能

1. 请求头（Request Headers）

  1. Host：指定请求的主机和端口号。
  2. User-Agent：表示发出请求的用户代理（浏览器或其他客户端）。
  3. Accept：指定客户端所能接收的内容类型。
  4. Accept-Language：指定客户端所能理解的语言。
  5. Accept-Encoding：指定客户端支持的内容编码方式。
  6. Connection：控制是否保持连接开启。
  7. Cookie：发送到服务器的Cookies数据。

2. 响应头（Response Headers）

  1. Content-Type：指定响应体的媒体类型。

  2. Content-Length： 指定响应体的字节长度。

  3. Server： 提供有关服务器的软件信息。

  4. Set-Cookie： 用于向客户端设置Cookie。

  5. Cache-Control：控制缓存的行为。 image.png

  6. Expires： 指定响应过期的时间。

  7. Location：在重定向时指定重定向目标的URL。

3. 其他头部

  1. Authorization：用于身份验证。
  2. Referer：表示当前请求的来源页面。

常见的状态码

1. HTTP状态码分类：

  • 1**：信息，服务器收到请求，需要请求者继续执行操作；

  • 2**：成功，操作被成功接收并处理；

  • 3**：重定向，需要进一步的操作以完成请求；

  • 4**：客户端错误，请求包含语法错误或者无法完成请求；

  • 5**：服务器错误，服务器在处理请求的过程中发生了错误；

2. 重定向的区别：

301 （Moved Permanently） 永久移动。请求的资源已被永久的移动到新URI，返回信息会包括新的URI，浏览器会自动定向到新URI。今后任何新的请求都应使用新的URI代替；

302 （Found） 临时重定向。与301类似。但资源只是临时被移动。客户端应继续使用原有URI；

303 （See Other） 查看其它地址。与301类似。使用GET和POST请求查看；

307 （Temporary Redirect） 临时重定向。与302类似。使用GET请求重定向；

关于缓存

1. http请求中的keep-alive

HTTP 请求中的 Keep-Alive 是一种用于维持TCP连接的机制，它允许在同一连接上发送多个请求和响应，而不是为每个请求都建立一个新的连接。这种方式可以提高网络性能，减少延迟，并降低由于频繁建立和关闭连接所带来的开销。

在HTTP/1.1中，Keep-Alive是默认启用的；

客户端和服务器在请求和响应头中使用以下字段来控制Kee-Alive：

image.png

注意事项：

  • 连接管理：虽然 Keep-Alive 可以提高性能，但过多的长连接可能会占用服务器资源，因此需要合理配置超时时间和最大请求数。
  • 兼容性：某些代理或中间设备可能不支持 Keep-Alive，可能会导致连接被意外关闭。
  • HTTP/2 和 HTTP/3：这两种版本的协议原生支持多路复用，这使得连接的管理更加高效，进一步提升了性能。

2. 关于 ETag 和 Last-Modified

概念：HTTP 协议中用于缓存控制的两个重要字段。

它们帮助客户端（如浏览器）确定请求的资源是否已发生变化，从而决定是否需要重新下载资源。

ETag 是一个由服务器生成的唯一标识符，用于表示特定版本的资源。每当资源发生变化时，服务器会生成一个新的 ETag 值。

用法： 客户端在第一次请求资源时，会收到服务器返回的 ETag。 在后续请求中，客户端可以通过 If-None-Match 首部将 ETag 值发送给服务器。 如果服务器发现该资源没有变化，它会返回 304 Not Modified 状态码，而不是发送完整的资源数据；如果资源有变化，则会返回新的资源和更新的 ETag。

Last-Modified 是一个表示资源最后修改时间的日期/时间戳。这个值通常是服务器在响应中返回的。

用法： 客户端在首次请求资源时，会收到 Last-Modified 时间戳。 在后续请求中，客户端可以通过 If-Modified-Since 首部向服务器发送这个时间戳。 如果资源未被修改，服务器会返回 304 Not Modified 状态码；如果资源已经被修改，服务器将返回新的资源和 Last-Modified 头。

image.png

3. 强缓存和协商缓存

在HTTP中，"强缓存"和"协商缓存"是两种用来提高资源加载效率和减少不必要网络传输的机制。它们都是浏览器缓存策略的重要组成部分。

image.png image.png 总结：

  • 强缓存：通过服务器返回的响应头中的 cache-control 字段或 expires 字段来控制，用于指定资源的缓存时间；
  • 协商缓存：由服务器来判断某个资源能否使用缓存内容，通过资源返回时携带的 etag（资源的指纹标识）和 last-modified（资源的最后修改时间）两个响应头，以及再次请求时浏览器在请求头中通过 if-none-match（对应 etag）和 if-modified-since（对应 last-modified）发送给服务器的字段进行判断。

使用这两种缓存策略，可以显著提高网页加载效率，减少不必要的网络流量和服务器负载。

关于刷新页面对http缓存的影响

  • 正常操作（地址栏输入 URL、跳转链接、前进后退等）：强制缓存和协商缓存均有效。也就是说，如果本地缓存的资源仍在有效期内（通过强制缓存的相关设置判断），会直接使用本地缓存，不会向服务器发送请求；否则，会向服务器发送请求，服务器通过协商缓存判断资源是否有更新，若没有更新则返回 304 状态码，继续使用本地资源，否则返回最新的资源。

  • 手动刷新（F5 或者点击刷新按钮、右击菜单刷新等）：强制缓存失效，但协商缓存有效。此时浏览器不会直接使用本地的强制缓存资源，而是会向服务器发送请求，携带 If-Modified-Since（基于 last-modified）和 If-None-Match（基于 etag）请求头，让服务器判断资源是否有更新。如果服务器判断资源没有变化，会返回 304 状态码，浏览器继续使用本地缓存；如果资源有更新，则服务器返回 200 状态码和最新的资源。

  • 强制刷新（Ctrl+F5 或 Cmd+R）：强制缓存和协商缓存均失效，浏览器会重新向服务器请求资源，而不使用本地的任何缓存。

HTTPS和HTTP的区别

HTTPS（HyperText Transfer Protocol Secure）是一种用于在计算机网络上进行安全通信的协议。

它是HTTP的安全版本，通过SSL/TLS协议提供加密和身份验证。

https协议的主要作用是：建立一个信息安全通道，来确保数组的传输，确保网站的真实性。

主要区别如下：

image.png

Restful API

RESTful API（Representational State Transfer API）是一种基于 REST 架构风格的应用程序编程接口（API）。它通过 HTTP 协议进行通信，允许系统之间以简单的方式交换数据。

1. 资源（Resources）

  • 在 REST 中，所有操作都是针对资源的。资源可以是任何实体，如用户、订单、商品等。
  • 每个资源都有一个唯一的 URI（统一资源标识符），通过这个 URI 可以对资源进行访问。

2. HTTP 方法（RESTful API 使用标准的 HTTP 方法来操作资源）

  • GET：检索资源。
  • POST：创建新资源。
  • PUT：更新现有资源（通常是全部更新）。
  • PATCH：部分更新现有资源。
  • DELETE：删除资源。

3. 无状态性（Statelessness）

RESTful API 是无状态的，每个请求都应包含处理该请求所需。

结语

第二次在掘金发文章，不足之处，请多包涵！

答案仅供大家参考，欢迎讨论！

大家有什么想看的，可以在评论区告诉我，谢谢！

avatar
文章
阅读
粉丝