WebSocket是什么？
WebSocket是一种在Web浏览器和服务器之间建立实时双向通信的技术。它不同于HTTP协议，因为HTTP是单向协议，只能客户端向服务器发送请求，服务器才能响应请求。而WebSocket可以实现双向通信，客户端和服务器可以随时互相发送消息，无需等待请求和响应。
WebSocket 协议是 HTML5 标准中的一部分，并在当前主流的浏览器和 Web 服务器中得到广泛支持。如今，大量的实时Web应用，如在线聊天、实时游戏、视频会议等都在使用 WebSocket 技术来实现低延迟、高效率和高可靠性的实时数据交换，而且相比其他技术（例如 Ajax 和长轮询），WebSocket 能够大幅降低网络带宽和服务器负载，提供更流畅的用户体验。
WebSocket协议的优势在于它可以使用标准的Web端口（HTTP的端口80和HTTPS的端口443），绕过大多数代理和防火墙限制。它也比传统的Ajax轮询和长轮询技术更快速、更具有响应性。
在WebSocket建立连接之前，它使用HTTP协议进行握手。客户端向服务器发送HTTP请求，并在请求头中包含一个特殊的标识符“Upgrade: websocket”，表示客户端希望升级协议到WebSocket。如果服务器支持WebSocket协议，它会响应一个状态码101 Switching Protocols，表示已成功升级协议，并开始使用WebSocket协议进行双向通信。
WebSocket使用一种基于帧的协议，在透明的TCP连接上提供了对双向通信的支持。这些帧通过二进制格式进行编码和解码，每个帧包含一些控制信息和实际的数据负载。
WebSocket优点
-
实时性：基于 WebSocket 协议的应用具有非常好的实时性，与HTTP协议相比能够更快地实现双向通信。
-
多协议：WebSocket 协议对底层传输协议并没有要求，它可以基于 TCP、UDP、SCTP 等协议，灵活性很高。
-
高效性：相较于轮询和 Comet 等技术，WebSocket协议可以降低数据交换的延迟，减少过多的头信息和降低网络带宽消耗率。
-
支持跨域：由于 WebSocket 是基于 TCP 协议的，较少受到同源策略限制，支持跨域使用。
-
减少服务端压力：相较于传统的 HTTP 请求，WebSocket 可以减少服务端的 CPU 和内存的开销，因为它的连接一旦建立就可以长期保持。
-
带有扩展特性：在协议的设计时，WebSocket 考虑的扩展特性比较多，例如可适应不同的压缩算法、消息编码方式等。
-
更好的二进制支持：在 WebSocket 中，字符串和二进制是等价的，非常方便处理二进制数据。
websocket的心跳机制和重连机制
心跳机制：客户端每隔一段时间向服务端发送一个特有的心跳消息，每次服务端收到消息后只需将消息返回，此时，若二者还保持连接，则客户端就会收到消息，若没收到，则说明连接断开，此时，客户端就要主动重连，完成一个周期
断线重连：若某时间段内客户端发送了消息，而服务端未返回，则认定为断线；这个时候会触发到websocket中的onclose事件，需要重新连接服务
WebSocket 入门（基本代码实现）
WebSocket通信一般分为前端与后端两个部分，具体如下：
前端部分：
1、创建WebSocket对象：在前端代码中，可以使用JavaScript的WebSocket API来创建WebSocket对象。例如，可以使用以下代码来创建一个WebSocket对象并连接到服务器：
var socket = new WebSocket("ws://localhost:8080");
2、发送数据：使用WebSocket对象的send()方法发送数据到服务器。例如，可以使用以下代码发送一条消息给服务器：
socket.send("Hello, server!");
3、接收数据：在WebSocket对象上添加一个监听器来接收服务器发送的消息。例如，可以使用以下代码来监听服务器发送的消息：
socket.onmessage = function(event) {
console.log("Received message: " + event.data);
};
后端部分：
-
创建WebSocket服务器：在后端代码中，可以使用各种编程语言和框架来创建WebSocket服务器。例如，使用Node.js和ws库可以很容易地创建WebSocket服务器。
-
处理连接请求：一旦建立了连接，服务器会收到一个连接请求。在服务器代码中，可以使用各种编程语言和框架来处理连接请求。例如，可以使用以下代码处理连接请求：
var WebSocketServer = require('ws').Server;
var wss = new WebSocketServer({ port: 8080 });
wss.on('connection', function(ws) {
console.log("New connection");
ws.on('message', function(message) {
console.log("Received message: " + message);
});
});
这段代码创建了一个WebSocket服务器，并在客户端建立连接时打印出一条消息。它还添加了一个监听器来接收客户端发送的消息。当服务器收到消息时，它将打印出该消息。
以上是WebSocket前后端交互的基本流程，可以根据实际需求进行调整和扩展。
总的来说，WebSocket是一种非常有用的技术，可以用于构建实时通信的应用程序，例如聊天应用、在线游戏以及股票市场等实时数据监控工具。它可以提供更快的数据传输速度和更好的用户体验，且易于使用和实现。文章来源：https://www.toymoban.com/news/detail-481460.html
文章来源地址https://www.toymoban.com/news/detail-481460.html
到了这里，关于WebSocket 是什么？WebSocket 前后端交互的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
