Dg's Blog-专注健康快乐每一天 - 前端面试
type: channel
link: https://zhougewk8.cn/qdms.html/
items: 简述TCP三次握手和四次挥手面试回答
items: 前端-基础面试题汇总(含Vue、React)

简述TCP三次握手和四次挥手面试回答
type: item
date: 2022-05-03T16:55:00+08:00
description: 简述TCP三次握手和四次挥手面试回答[scode type="green"]本文转自 猿人谷 长期维护版本：https://yuanrengu.com/2020/77eef79f.html[/scode][scode type="lblue"]目前把下面总结好的理解并且牢记完全可以应对面试官。[/scode]三次握手四次挥手是前端常见面试题之一，也被一些面试官作为热身题。很多小伙伴说这个问题刚开始回答的挺好，但是后面越回答越冒冷汗，最后就歇菜了。希望大家带着如下问题进行阅读，收获会更大。1.请说出三次握手的作用以及过程2.ISN(Initial Sequence Number)是固定的吗？3.三次握手过程中可以携带数据吗？4.什么是半连接队列？5.三次握手可以携带参数吗？6.四次挥手的过程首先看一张图来理解一下整个三次握手过程一、三次握手1.三次握手的作用作用：确定双方的接收、发送能力是否正常，指定自己的初始化序列号，为后续可靠传输做准备1.2 三次握手的过程刚开客户端处于Closed状态，服务端处于Listen状态第一次握手：客户端向服务端发送SYN报文，并指明客户端初始化序列号ISN(c),此时客户端进入SYN_send状态/等待第二次握手：服务端收到SYN报文后，会以自己的SYN作为应答，并指明自己的初始化序列号ISN，同时将客户端的ISN+1作为Ack的值，表示收到客户端的SYN，同时进入SYN_RCVD状态/接收第三次：客户端收到SYN后，发送一个ACK报文，也是将服务端的ISN+1作为ACK的值，表示收到服务端的SYN报文。此时客户端处于established状态，服务端收到ACK后，也处于established状态，此时双方成功建立连接2.ISN是固定的吗？答案：不是固定的，三次握手的一个重要功能就是交换双方的ISN，以便让对方知道接收到的输入如何按序列号进行组装，如果ISN是固定的，攻击者很容易推断出后续的确认号，所以ISN是动态生成的3.什么是半连接队列？服务端第一次收到SYN后，就会处于SYN_RCVD,此时双方还没完全建立连接，服务端会把这种状态放在一个队列中，我们把这这种队列称为半连接队列，等三次握手完毕后，建立的连接就会放在全连接队列中，如果队列满了就会产生丢包的情况。4.三次握手可以携带参数吗？第三次握手时可以携带参数，第一次和第二次不能携带，举例：第一次就可以携带参数的话，假如有人恶意攻击服务器，攻击者根本不在乎服务器的接收、发送能力是否正常，如果每次都在第一次握手中的SYN报文中携带大量数据，重复的发SYN报文的话，那么服务器会花费大量时间、内存空间接收这些报文。所以得出的结论，如果在第一次握手中携带数据，那么服务器更容易收到攻击对于在第三次携带数据的话，此时客户端已经处于established状态，对于客户端来说已经建立连接，并且确定服务端的发送和接收能力时正常的，所以携带参数完全没问题。二、四次挥手第一次挥手：客户端发送一个FIN报文，报文中指定一个序列号，此时客户端进入FIN_WAIT_1状态，表示停止在发送数据第二次挥手：服务端收到FIN报文后，会回应一个ACK报文，把客户端的序列号+1作为ACK的值，此时服务端处于Close_WAIT状态，表示服务端同意关闭请求，客户端进入FIN_WAIT2状态 等待服务端发出连接释放报文第三次挥手：如果服务端也想断开连接了，和第一次挥手一样发出FIN报文，此时服务端处于LAST_ACK状态，表示发出连接释放报文，等待客户端确认第四次挥手：客户端收到FIN报文后，一样发送一个ACK报文，且把服务器的序列号+1作为ACK的值。此时客户端进入TIME_WAIT状态，需要经过等待计时器的时间2MSL后仍然没有回复，才会进入closed状态，而服务端收到ACK报文后直接进入Closed状态

前端-基础面试题汇总(含Vue、React)
type: item
date: 2022-05-02T22:59:00+08:00
description: 一、移动web部分1、前端页面有哪三层构成，分别是什么？作用是什么？1、结构层：由 HTML 标记语言负责创建，仅负责语义的表达。解决了页面“内容是什么”的问题。 2、表示层：由CSS负责创建，解决了页面“如何显示内容”的问题。 3、行为层：由脚本（js）负责。解决了页面上“内容应该如何对事件作出反应”的问题2、主流的浏览器分别是什么内核？Trident内核：（国产的绝大部分浏览器）IE，360，搜狗 Gecko内核：Firefox，NetScape6及以上 Presto内核：Opera7及以上 Webkit内核：（国产大部分双核浏览器其中一核）Safari（苹果），Chrome3、如何居中一个浮动元素?父元素和子元素同时左浮动，然后父元素相对左移动50%，再然后子元素相对右移动50%，或者子元素相对左移动-50%也就可以了。 Test Float Element Center 4、行内元素有哪些？块级元素有哪些？空元素（void）有哪些？1、行内元素：a，b，span，img，input，strong，label，button，select，textarea，em 2、块级元素：div，ul（无序列表），ol，li，dl（自定义列表），dt（自定义列表项），dd（自定义列表项的定义），p，h1-h6，blockquote（块引用） 3、空元素（void）：即没有内容的HTML元素。br（换行），hr（水平分割线），meta，link，input，img5、BFC（Block Formatting Context，块级格式化上下文）1、是什么：决定了元素如何对其内容进行定位，以及与其他元素的关系和相互作用。简言之，就是一个特殊的块，内部的元素和外部的元素不会相互影响。BFC内的盒子会在垂直方向上一个接一个地放置，垂直方向上也会发生外边距重叠。 2、应用场景：自适应布局（BFC不与float box重叠）、清除浮动（计算BFC的高度时，内部的浮动元素也被计算在内）、防止外边距重叠 3、如何触发BFC：float属性（不为none）、overflow属性（不为visible）、position属性（absolute，fixed）、display属性（inline-block，table-cell，table-caption，flex，inline-flex）6、CSS选择器的优先级!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 7、初始化CSS样式的意义1、为什么要初始化CSS样式：因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没有对CSS初始化往往会出现浏览器之间的页面显示差异。8、HTML5新增了哪些属性1. 语义化标签: header nav section article aside footer 2. 多媒体标签: video audio 3. input类型: number search email tel date file time url 4. 本地离线存储 localStorage 长期存储数据,改变浏览器数据不会丢失 sessionStorage 浏览器关闭数据会丢失 5. 自定义属性 data-* 6. 画布 Canvas 7. webscoket 双向通信协议9、CSS3新增了哪些属性1. 圆角 border-radius 2. 盒子模型 box-sizing 3. 阴影 box-shadow 盒子阴影 text-shadow 文字阴影 4. 过渡 transition 5. 2D转换transform translate(平移) scale(缩放) skew(斜切) rotate(旋转) transform-origin 控制转换中心点 6. 3D转换 perspective(透视距) transform-style(3D控件效果) 7. 渐变 linear-gradient radial-gradient 8. 弹性布局 flex 9. 媒体查询 @media screen and () {...} 10. 边框图片 border-image 11. 自定义动画 @keyframes animation 12. 颜色 新增RGBA HSLA模式 13. 背景 background-size background-origin background-clip10、对HTML语义化的理解1、用正确的标签做正确的事情 2、HTML语义化让页面的内容结构化，结构更清晰，便于对浏览器、搜索引擎解析 3、即使在没有样式CSS情况下也以一种文档格式显示，并且是易于阅读的 4、搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，利于SEO …