双向信息传输(服务端、客户端) ​

• WebSockets 是一种先进技术。它可以在用户浏览器和服务器之间打开交互式通信会话。
• 使用此 API，您可以向服务器发送消息并接收事件驱动的响应，而无需通过轮询服务器的方式以获得响应。
• 参考 MDN

Socket 原理 ​

套接字(socket)概念 ​

套接字(socket)是通信的基石，是支持 TCP/IP 协议的网络通信的基本操作单元。它是网络通信过程中端点的抽象表示。套接字上联应用进程，下联网络协议栈，是应用程序通过网络协议进行通信的接口，是应用程序与网络协议栈进行交互的接口。

建立 socket 连接 ​

建立 Socket 连接至少需要一对套接字：
其中一个运行于客户端，称为 ClientSocket ，
另一个运行于服务器端，称为 ServerSocket 。

套接字之间的连接过程分为 3 个步骤：服务器监听、客户端请求、连接确认。

服务器监听：服务器端套接字并不定位具体的客户端套接字，而是处于等待连接的状态，实时监控网络状态，等待客户端的连接请求。

客户端请求：客户端的套接字必须首先描述它要连接的服务器的套接字，指出服务器端套接字的地址和端口号，然后就向服务器端套接字提出连接请求。

连接确认：当服务器端套接字监听或者接收到客户端套接字连接请求时，就响应客户端套接字的请求，建立一个新线程，把服务器端套接字的描述发给客户端，一旦客户端确认，双方就正式建立连接。而服务器端套接字继续处于监听状态，继续接收其他客户端套接字的连接请求。

WebSocket ​

TCP/IP 协议 TCP Socket，实际上是一种功能接口，通过这些接口就可以使用 TCP/IP 协议栈在传输层收发数据。

而 WebSocket 中，“Web”指的就是 HTTP，“Socket”是在套接字调用，WebSocket 就是运行在 Web，也就是 HTTP 上的 Socket 通信规范，提供与 TCP Socket 类似的功能，使用它可以像 TCP Socket 一样调用下层协议栈，任意的收发数据。

与 HTTP ​

WebSocket 是一种基于 TCP 轻量级网络通信协议，地位上与 HTTP 平级。但 WebSocket 是长连接，而 HTTP 是短连接。

WebSocket 同 HTTP 一样也是应用层协议，但它是一种双向通信协议，建立在 TCP 之上，允许服务端主动向客户端推送数据。它的目的是，用即时通讯替代轮询。常见的即时通讯有网页的 QQ，聊天系统等。

WebSocket protocol 是 HTML5 新协议。它实现了浏览器与服务器全双工通信(full-duplex)。首次握手需借助 HTTP请求，当连接建立后，真正传输时走 TCP，此时就无需 HTTP。

这是搭上 HTTP 的“便车”，利用 HTTP 本身的“协议升级”特性，“伪装”成 HTTP，这样就能绕过浏览器沙盒、网络防火墙等限制，这也是 WebSocket 与 HTTP 的另一个重要关联点。

握手 ​

握手是 WebSockets 中的“Web”。这是从 HTTP 到 WS 的桥梁。在 WebSocket API 中，浏览器和服务器只需要完成一次握手， 两者之间就直接可以创建持久性的连接，并进行双向数据传输。

WebSocket 握手是一个标准 HTTP GET 请求，但需带上两个协议升级专用头字段：

{
  Connection: Upgrade, // 表示要求协议“升级”
  Upgrade: websocket, // 表示要“升级”成 WebSocket 协议
}

为防止普通 HTTP 被“意外”识别成 WebSocket，握手还增加两个额外认证用头字段(所谓的“挑战”，Challenge)：

{
  Sec-WebSocket-Key："Base64编码的16字节随机数，作为认证密钥", // 表示“是的，我真的想打开一个 WebSocket 连接。”
  Sec-WebSocket-Version：'协议的版本号，当前必须是13',
}

服务器收到 HTTP 请求报文，看到上面的四个字段，就知道这不是一个普通的 GET 请求，而是 WebSocket 的升级请求，于是就不走普通的 HTTP 处理流程，而是构造一个特殊的 101 Switching Protocols 响应报文，通知客户端，接下来就不用 HTTP 了，全改用 WebSocket 协议通信。

WebSocket 的握手响应报文也是有特殊格式的，要用字段 Sec-WebSocket-Accept 验证客户端请求报文，同样也是为了防止误连接。

握手完成，后续传输的数据就不再是 HTTP 报文，而是 WebSocket 格式的二进制帧了。

Websocket 默认请求协议为ws://，默认端口80
对 TLS 加密请求协议为wss://，默认端口443

构造函数 ​

WebSocket() 构造器会返回一个 WebSocket 对象。

var aWebSocket = new WebSocket(url [, protocols]);

• url：要连接的 URL，服务器将响应的 URL。
• protocols(可选)：一个协议字符串或者一个包含协议字符串的数组。这些字符串用于指定子协议，这样单个服务器可以实现多个 WebSocket 子协议（例如，您可能希望一台服务器能够根据指定的协议（protocol）处理不同类型的交互）。如果不指定协议字符串，则假定为空字符串。

属性、方法、事件 ​

• 属性：WebSocket.readyState、WebSocket.onopen、WebSocket.onmessage、WebSocket.onerror、WebSocket.onclose
• 方法：WebSocket.close([code[, reason]])、WebSocket.send(data)
• 事件：open、message、error、close

TCP/IP 协议簇 ​

TCP/IP（Transmission Control Protocol/Internet Protocol，传输控制协议/网际协议）是指能够在多个不同网络间实现信息传输的协议簇。TCP/IP 协议不仅仅指的是 TCP 和 IP 两个协议，而是指一个由 FTP、SMTP、TCP、UDP、IP 等协议构成的协议簇， 只是因为在 TCP/IP 协议中 TCP 协议和 IP 协议最具代表性，所以被称为 TCP/IP 协议。

在 TCP/IP 网络体系结构中，
TCP(传输控制协议，Transport Control Protocol)、
UDP(用户数据报协议，User Data Protocol)
是传输层最重要的两种协议，为上层用户提供不同级别的通信可靠性。

TCP——面向连接、可靠——邮件、登录 ​

TCP 定义了两台计算机之间进行可靠的传输而交换的数据和确认信息的格式，以及计算机为了确保数据的正确到达而采取的措施。TCP 最大的特点就是提供的是面向连接、可靠的字节流服务。

面向连接就是在正式通信前必须要与对方建立起连接，是按照电话系统建模的。类似打电话模式，必须等线路接通了、对方拿起话筒才能相互通话。

TCP 主要应用于文件传输精确性较高且不是很紧急的情景，比如电子邮件、远程登录等。

UDP——无连接、不可靠——视频、音乐 ​

UDP 是一个简单的面向数据报的传输层协议。提供的是无连接、不可靠的数据流传输。UDP 不提供可靠性，也不提供报文到达确认、排序以及流量控制等功能。由于 UDP 在传输数据报前不用在客户和服务器之间建立一个连接，且没有超时重发等机制，故而传输速度快。

无连接就是在正式通信前不必与对方先建立连接，不管对方状态就直接发送。类似手机短信模式，只要发给对方手机号就行，无需对方任何操作。

UDP 被广泛应用于数据量大且精确性要求不高的数据传输，比如视频、音乐等应用基本上都是 UDP 传输协议。

TCP 与 HTTP ​

TCP 是底层通讯协议，定义的是数据传输和连接方式的规范。
HTTP 是应用层协议，定义的是传输数据的内容的规范。
HTTP 协议中的数据是利用 TCP 协议传输的，所以支持 HTTP 也就一定支持 TCP。

TCP 3 次握手 ​

建立起一个 TCP 连接需要 3 次握手：

• 第 1 次握手：客户端发送 syn 包(syn=j)到服务器，并进入 SYN_SEND 状态，等待服务器确认；
• 第 2 次握手：服务器收到 syn 包，必须确认客户的 SYN（ack=j+1），同时自己也发送一个 SYN 包（syn=k），即 SYN+ACK 包，此时服务器进入 SYN_RECV 状态；
• 第 3 次握手：客户端收到服务器的 SYN ＋ ACK 包，向服务器发送确认包 ACK(ack=k+1)，此包发送完毕，客户端和服务器进入 ESTABLISHED 状态，完成三次握手。

握手过程中传送的包里不包含数据，3 次握手完毕后，客户端与服务器才正式开始传送数据。

HTTP 连接 ​

HTTP 协议即超文本传送协议(Hypertext Transfer Protocol)，是 Web 联网的基础，也是手机联网常用的协议之一，HTTP 协议是建立在 TCP 协议之上的一种应用。

HTTP 在每次请求结束后都会主动释放连接，因此 HTTP 连接是一种短连接，要保持客户端程序的在线状态，需要不断地向服务器发起连接请求，即轮询。

Vite 中怎么用 ​

Vite hmr(热更新)中，文件更新信息的传输，就是借助 WebSocket，保持客户端与服务端通信来实现的。