前端面试题(HTTP)相关

最新推荐文章于 2024-07-25 17:33:18 发布

Kerry.Xiao

最新推荐文章于 2024-07-25 17:33:18 发布

阅读量862

点赞数 5

分类专栏：面试题文章标签： http 网络协议网络前端

本文链接：https://blog.csdn.net/weixin_45572708/article/details/139866741

版权

面试题专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1.http和https的区别

HTTP：

是一种用于在万维网上传输数据的基本协议。
不提供数据加密，信息以明文形式传输，存在一定安全风险。
相对来说传输效率较高。

HTTPS：

在 HTTP 的基础上加入了 SSL/TLS 加密协议。
对传输的数据进行加密，保障了数据的安全性和完整性。
能有效防止数据在传输过程中被窃取、篡改等。
由于加密过程，在一定程度上会影响传输效率，但能提供更高的安全性。

HTTPS 已逐渐成为网站的主流配置，尤其是对于涉及敏感信息（如用户登录、支付等）的网站，以保障用户的信息安全和隐私。

2.一句话概括* TCP三次握手

TCP 三次握手是这样一个过程：首先，客户端向服务器发送一个带有 SYN（同步序列编号）标志的数据包，表示请求建立连接；服务器收到后，会回传一个带有 SYN 和 ACK（确认）标志的数据包，表示同意建立连接并确认收到客户端请求；最后，客户端再回传一个带有 ACK 标志的数据包，确认收到服务器的回应，至此完成三次握手，双方建立起可靠的 TCP 连接。

概括:TCP 三次握手是客户端与服务器在建立 TCP 连接时进行的三次信息交互过程，用于确保双方通信的准备就绪和连接的可靠建立。

3.* Cookie、session Storage、localStorage

区别：

Cookie：

大小有限制，通常为 4KB 左右。
会随 HTTP 请求一起发送到服务器，可用于服务器端识别用户状态等。
可以设置过期时间，若不设置则在浏览器关闭后失效。

sessionStorage：

存储容量一般比 Cookie 大。
数据仅在当前会话（当前页面及其打开的子页面）有效，关闭浏览器窗口后数据会被清除。
不会随 HTTP 请求发送到服务器。

localStorage：

存储容量较大。
数据持久化存储，除非手动删除，否则一直存在。
也不会随 HTTP 请求发送到服务器。

作用：

Cookie：用于在客户端和服务器之间传递少量的状态信息，帮助服务器识别用户和维持会话，可用于实现一些个性化设置的跨页面传递。

sessionStorage：主要用于在当前浏览器会话期间保存临时数据，在同一会话的不同页面间共享数据，比如保存一些临时的表单状态等。

localStorage：用于长期存储数据，即使浏览器关闭或重新打开，数据依然存在，可用于保存用户偏好设置、离线数据等。

4.对 HTML 语义化标签的理解

例如，<header> 表示头部，<nav> 表示导航，<main> 表示主要内容区域，<article> 表示独立的文章内容，<footer> 表示底部等。这些语义化标签使得网页的结构更加清晰、合理，提升了整体的质量和可用性。

HTML 语义化涉及多种元素，以下是一些常见的语义化元素：

<header>：表示页面或章节的头部。
<nav>：用于导航部分。
<main>：页面主要内容区域。
<article>：表示一篇独立的文章。
<section>：章节或区域。
<aside>：侧边栏内容。
<footer>：页面或章节的底部。

5. click 在 ios 上有 300ms 延迟，原因及如何解决？

禁用缩放：通过设置<meta name="viewport" content="width=device-width, user-scalable=no">禁用页面缩放，这样就不会有双击缩放的操作，从而避免了 300ms 的延迟。
使用 FastClick：FastClick 是一个专门用于解决移动端浏览器 300ms 点击延迟问题的库。它的原理是在检测到touchend事件后，立即触发一个模拟的click事件，并阻止浏览器在 300ms 之后真正触发的click事件。
使用 touch-action 属性：将 touch-action 属性设置为none，可以禁用浏览器的默认触摸行为，从而避免 300ms 的延迟。

6.介绍知道的 http 返回的状态码

200 OK：表示请求成功。
201 Created：表示资源成功创建。
204 No Content：表示请求成功处理，但没有返回内容。
301 Moved Permanently：表示资源已永久移动到新位置。
302 Found / Moved Temporarily：表示资源临时移动。
304 Not Modified：表示资源未被修改，可使用缓存内容。
400 Bad Request：表示请求存在语法错误或无法被服务器理解。
401 Unauthorized：表示未经授权，需要认证。
403 Forbidden：表示禁止访问，通常是权限问题。
404 Not Found：表示请求的资源未找到。
500 Internal Server Error：表示服务器内部错误。
502 Bad Gateway：表示网关错误。
503 Service Unavailable：表示服务不可用。
504 Gateway Timeout：表示网关超时。

7.前端优化

减少 HTTP 请求：合并文件、使用雪碧图等。
压缩资源：对 CSS、JavaScript、HTML 等进行压缩。
优化图片：使用合适的图片格式，压缩图片大小。
使用 CDN（内容分发网络）：加速资源加载。
缓存策略：合理设置浏览器缓存。
代码优化：减少不必要的代码，优化 JavaScript 算法等。
懒加载：如图片懒加载、异步模块懒加载。
预加载：提前加载重要资源。
优化页面渲染：避免阻塞式的 JavaScript 执行，合理使用 CSS 动画和过渡。
减少 DOM 操作：降低频繁操作 DOM 带来的性能开销。
提升首屏加载速度：优先加载关键资源。
优化字体加载：避免字体加载导致页面闪烁等问题。

8.GET 和 POST 的区别

请求目的：GET 用于从服务器获取数据，POST 用于向服务器提交数据。
参数传递：GET 请求的参数通常通过 URL 进行传递，以?作为分隔符，参数以键值对的形式附加在 URL 后面；POST 请求的参数则放在请求体中。
数据可见性：GET 请求的参数在 URL 中可见，可能会被浏览器缓存、记录在历史记录中，并且可以被收藏为书签；POST 请求的参数不会显示在 URL 中，相对更加安全。
数据长度限制：GET 请求的 URL 长度有限制，一般不超过 2048 个字符；POST 请求可以传输较大的数据量，具体限制取决于服务器的配置。
数据类型支持：GET 请求只接受 ASCII 字符，而 POST 请求没有限制，可以支持多种编码方式。
安全性：GET 请求的参数直接暴露在 URL 中，不太适合传输敏感信息；POST 请求的参数相对更加安全。
幂等性：GET 请求是幂等的，即多次重复请求不会产生额外的副作用；POST 请求不是幂等的，多次提交可能会产生不同的结果。
缓存处理：GET 请求可以被浏览器缓存，而 POST 请求默认不会被缓存。
TCP 数据包：GET 请求产生一个 TCP 数据包；POST 请求产生两个 TCP 数据包。