WebSocket详解
定位与图示
「图文详解」TCP为啥要3次握手和4次挥手?3次挥手不行吗?-腾讯云开发者社区-腾讯云
WebSocket是一种在Web应用程序中实现全双工通信的协议。它允许客户端和服务器之间建立一个持久的连接,双方可以在这个连接上相互发送数据,而不需要通过传统的HTTP请求/响应模式。以下是对WebSocket的详细解析:
一、WebSocket的特点
- 双向通信:WebSocket实现了服务器与客户端之间的双向通信,即服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息。
- 持久连接:一旦WebSocket连接建立,它将持续存在,直到被显式关闭。这种持久连接避免了HTTP请求/响应模式中的频繁握手和断开连接的开销。
- 高效性:WebSocket使用较少的开销来维持连接,并且数据格式轻量,性能开销小,通信高效。
- 兼容性和灵活性:WebSocket与HTTP协议有着良好的兼容性,默认端口也是80和443,并且握手阶段采用HTTP协议。此外,WebSocket可以发送文本和二进制数据,并且没有同源限制。
二、WebSocket的工作原理
- 握手阶段:WebSocket连接的建立从一个HTTP请求开始,这个请求通常被称为“握手”请求。在请求中,客户端通过Upgrade和Connection头字段表示希望将协议从HTTP升级到WebSocket。服务器如果同意升级,会返回一个状态码为101 Switching Protocols的响应,表示协议升级成功。
- 数据传输:一旦WebSocket连接建立,客户端和服务器之间的通信就使用WebSocket帧(frame)进行。WebSocket帧有不同的类型,包括文本帧、二进制帧、关闭帧、Ping帧和Pong帧等。这些帧用于传输数据和维持连接的活跃状态。
- 关闭连接:WebSocket连接可以由客户端或服务器任意一方关闭。关闭连接的过程通过发送一个关闭帧来实现,另一方收到关闭帧后会响应一个关闭帧并关闭连接。
三、WebSocket的应用场景
WebSocket特别适用于需要实时通信、实时推送数据、实时同步编辑等场景。以下是一些具体的应用示例:
- 实时聊天:WebSocket可以用于实现即时通讯功能,如在线聊天室、多人游戏等。
- 实时数据更新:WebSocket可以用于实时地推送数据更新,如实时股票行情、实时天气预报等。
- 协同编辑:WebSocket可以用于实现多人协同编辑功能,如在线文档协作、团队代码编辑等。
- 实时监控:WebSocket可以用于实时监控系统,如监控设备的运行状态、实时监测交通流量等。
- 游戏开发:WebSocket可以用于开发实时多人在线游戏,如棋牌游戏、角色扮演游戏等。
四、WebSocket的优缺点
优点:
- 实时性:WebSocket能够实时地双向通信。
- 减少网络流量:WebSocket连接只需要进行一次握手,之后就可以保持长连接,减少了网络流量和延迟。
- 跨平台支持:WebSocket协议可以在多种平台上使用。
缺点:
- 兼容性问题:WebSocket协议在一些旧版本的浏览器上不被支持。
- 服务器资源占用:由于WebSocket的长连接特性,服务器需要维护大量的连接,可能会占用较多的服务器资源。
- 安全性问题:WebSocket连接需要特殊的安全设置以防止恶意攻击和数据泄漏。
综上所述,WebSocket是一种强大的实时通信协议,它的双向通信和持久连接特性使得它在许多实时应用场景中发挥着重要作用。然而,在使用WebSocket时也需要注意其兼容性和安全性问题,并合理评估其对服务器资源的占用情况。
----------------------------------------------------------------------------------------------
WebSocket常见方法
WebSocket在客户端和服务器端的常见方法主要涉及连接管理、消息处理和错误处理等方面。以下是对这些常见方法的详细归纳:
客户端常见方法
- 创建WebSocket连接
- 使用
WebSocket
构造函数创建一个新的WebSocket连接。构造函数接受一个表示要连接的服务器端点的URL作为参数。 - 示例代码:
let ws = new WebSocket("ws://localhost:8080/");
- 使用
- 监听连接事件
onopen
:当WebSocket连接成功建立时触发。- 示例代码:
ws.onopen = function(event) { console.log("连接已打开..."); };
- 发送消息
- 使用
send()
方法向服务器发送数据。数据可以是文本或二进制数据。 - 示例代码:
ws.send("Hello Server!");
- 使用
- 监听接收消息
onmessage
:当客户端收到服务器发送的消息时触发。- 示例代码:
ws.onmessage = function(event) { console.log("收到消息: " + event.data); };
- 监听错误事件
onerror
:当WebSocket连接发生错误时触发。- 示例代码:
ws.onerror = function(event) { console.error("WebSocket错误: " + event.data); };
- 关闭连接
- 使用
close()
方法关闭WebSocket连接。可以指定一个状态码和可选的原因描述。 - 示例代码:
ws.close(1000, "正常关闭");
- 使用
- 监听连接关闭事件
onclose
:当WebSocket连接关闭时触发。- 示例代码:
ws.onclose = function(event) { console.log("连接已关闭..."); };
服务器端常见方法(以Node.js的ws
库为例)
- 创建WebSocket服务器
- 使用
ws.Server
类创建一个WebSocket服务器,并监听指定的端口。 - 示例代码:
const wss = new WebSocket.Server({ port: 8080 });
- 使用
- 监听连接事件
- 监听
connection
事件以处理新的客户端连接。 - 示例代码:
wss.on('connection', function connection(ws) { /* 处理连接 */ });
- 监听
- 接收消息
- 在连接回调函数中,监听
message
事件以接收客户端发送的消息。 - 示例代码:
ws.on('message', function incoming(message) { console.log('收到消息: ' + message); });
- 在连接回调函数中,监听
- 发送消息
- 使用
send()
方法向客户端发送数据。 - 示例代码:
ws.send('Hello Client!');
- 使用
- 监听关闭事件
- 监听
close
事件以处理客户端或服务器关闭连接的情况。 - 示例代码:
ws.on('close', function() { console.log('客户端已断开连接'); });
- 监听
- 处理错误
- 可以在连接或消息处理过程中添加错误处理逻辑。
- 示例代码:
ws.on('error', function(error) { console.error('WebSocket错误: ' + error); });
总结
WebSocket在客户端和服务器端的常见方法主要涉及连接管理(创建连接、关闭连接、监听连接事件)、消息处理(发送消息、接收消息)和错误处理。这些方法使得WebSocket能够实现高效的实时双向通信。在开发过程中,需要根据具体的应用场景和需求来选择合适的方法。
-------------------------------------------------------------------------------------------
Websocket&Node.JS
在Node.js中使用WebSocket,一个常见的库是ws
。这个库提供了WebSocket的服务器端和客户端实现。下面我将给出一个简单的Node.js WebSocket服务器和客户端的代码示例。
WebSocket 服务器端(使用ws
库)
首先,你需要安装ws
库。在你的Node.js项目目录中,运行以下命令来安装它:
npm install ws
然后,你可以创建一个WebSocket服务器,如下所示:
// server.js
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
});
ws.send('something');
ws.on('close', () => {
console.log('Client disconnected');
});
});
console.log('WebSocket server is running on ws://localhost:8080');
在这个例子中,我们创建了一个WebSocket服务器,监听8080端口。每当有客户端连接时,服务器都会向客户端发送一条消息,并监听来自客户端的消息。
WebSocket 客户端(使用浏览器)
WebSocket客户端通常运行在浏览器中,但你也可以使用Node.js来创建一个客户端。不过,为了简单起见,这里我将展示如何在浏览器中创建WebSocket客户端。
在HTML文件中,你可以这样编写WebSocket客户端代码:
<!DOCTYPE html>
<html>
<head>
<title>WebSocket Client</title>
<script>
window.onload = function() {
var ws = new WebSocket('ws://localhost:8080');
ws.onopen = function() {
console.log('Connected to the server');
ws.send('Hello Server!');
};
ws.onmessage = function(event) {
console.log('Received from server: ' + event.data);
};
ws.onclose = function() {
console.log('Disconnected from server');
};
ws.onerror = function(error) {
console.error('WebSocket Error: ' + error);
};
};
</script>
</head>
<body>
<h1>WebSocket Client</h1>
</body>
</html>
在这个HTML文件中,我们创建了一个WebSocket客户端,它尝试连接到ws://localhost:8080
。连接成功后,它向服务器发送一条消息,并监听来自服务器的消息。
运行示例
- 首先,确保你的Node.js服务器(
server.js
)正在运行。 - 然后,在浏览器中打开包含WebSocket客户端代码的HTML文件。
- 你应该能在浏览器的控制台中看到连接成功、从服务器接收到的消息等日志。
这就是一个基本的Node.js WebSocket服务器和客户端的示例。你可以根据需要扩展这些示例,比如添加更复杂的消息处理逻辑、支持多个客户端连接等。
WebSocket三次握手四次挥手?
WebSocket本身并不直接涉及TCP的三次握手和四次挥手过程,因为WebSocket是建立在TCP协议之上的一个应用层协议。然而,WebSocket连接的建立和断开确实依赖于TCP连接的建立和断开,而TCP连接的建立和断开正是通过三次握手和四次挥手来实现的。
WebSocket的三次握手
WebSocket的“三次握手”实际上是指WebSocket连接建立时,底层TCP连接所经历的三次握手过程。这个过程是TCP协议为了建立可靠的连接而设计的:
- 第一次握手:客户端发送一个SYN包(同步序列编号)到服务器,并进入SYN_SENT状态,等待服务器确认。
- 第二次握手:服务器收到SYN包后,发送一个SYN+ACK包(同步序列编号+确认)给客户端,同时自己也进入SYN_RECV状态。
- 第三次握手:客户端收到服务器的SYN+ACK包后,发送一个ACK包给服务器以确认连接。此时,客户端和服务器都进入ESTABLISHED(TCP连接成功)状态,完成三次握手。
需要注意的是,这里的“三次握手”是TCP层面的,而不是WebSocket协议本身的内容。WebSocket协议只是在TCP连接建立之后,通过特定的HTTP请求和响应头来协商升级协议,从而实现持久的全双工通信。
WebSocket的断开连接
与TCP的四次挥手类似,WebSocket连接的断开也涉及到双方的确认过程,但WebSocket协议本身并没有定义具体的断开流程(因为那是TCP协议的工作)。在WebSocket中,当一方想要断开连接时,会发送一个关闭帧给对方,对方收到后也会回复一个关闭帧作为确认。然而,这个过程在TCP层面可能仍然会经历类似四次挥手的步骤来确保连接的可靠关闭。
总结
WebSocket的“三次握手”和“四次挥手”实际上是底层TCP协议为了建立和断开连接而进行的过程。WebSocket协议本身并不直接涉及这些过程,但它依赖于TCP协议来提供可靠的数据传输服务。因此,在理解和实现WebSocket时,需要了解TCP协议的相关知识。
原文地址:https://blog.csdn.net/m0_55049655/article/details/142533301
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!