WebSocket 是 HTML5 中的一项新技术,它提供了一种基于浏览器和服务器之间全双工通信的方式。Node.js 本身就是一个事件驱动的服务端 JavaScript 运行环境,因此它非常适合用来实现 WebSocket 服务。
WebSocket 的基本概念和工作原理
WebSocket 是建立在 HTTP(80 端口)或 HTTPS(443 端口)协议之上的一种持久化的协议,它的工作原理是:
- 客户端和服务器之间通过 HTTP/HTTPS 建立连接
- 客户端向服务器发送 Upgrade 请求,请求升级连接协议为 WebSocket
- 服务器收到 Upgrade 请求后,响应 101 Switching Protocols 表示成功升级协议
- 升级成功后,客户端和服务器之间的双向通信就不再依赖 HTTP 协议,而是使用 WebSocket 协议
WebSocket 采用基于事件的编程模型,即客户端和服务器之间建立 WebSocket 连接后,它们会相互发送事件(例如消息、错误、关闭等),应用程序可以编写事件处理程序来处理这些事件。
使用 Node.js 实现 WebSocket 服务
Node.js 提供了许多第三方模块来实现 WebSocket 服务,比较流行的有:
ws
模块socket.io
模块uws
模块
这里以 ws
模块为例,演示如何使用 Node.js 实现 WebSocket 服务。
安装 ws
模块
使用 npm 命令安装 ws
模块:
npm install ws
创建 WebSocket 服务器
使用以下代码创建一个简单的 WebSocket 服务器:
-- -------------------- ---- ------- ----- --------- - -------------- ----- ------ - --- ------------------ ----- ---- --- ----------------------- -------- -- - ------------------- ------------- -------------------- ------ -- - --------------------- ---------- ------ --- ------------------ -- -- - ------------------- ---------------- --- ---
这段代码使用 ws
模块创建了一个 WebSocket 服务器,监听在 8080 端口,然后处理 connection
事件。每当一个客户端连接到服务器时,connection
事件就会被触发,这时候我们可以在控制台输出一条日志,表示客户端已连接。
接着,在 connection
事件处理函数中,我们添加了两个事件监听器:
message
事件监听器:用于处理客户端发送的消息。close
事件监听器:用于处理客户端关闭连接的事件。
注意,上述代码中的 socket
对象表示当前客户端的 WebSocket 对象。
使用 WebSocket 客户端与服务器通信
以下是一个简单的 WebSocket 客户端代码,使用 Node.js 中的 ws
模块来连接上述创建的 WebSocket 服务器:
-- -------------------- ---- ------- ----- --------- - -------------- ----- -- - --- --------------------------------- ------------- -- -- - ----------------------- --------------- --------------- ---------- --- ---------------- ------ -- - --------------------- ---------- ------ --- -------------- -- -- - ----------------------- ---------- ---
这段代码使用 ws
模块创建了一个 WebSocket 客户端对象,连接到刚刚创建的 WebSocket 服务器。
在 open
事件处理函数中,我们可以输出一条日志表示客户端已连接,并发送一个消息给服务器。
在 message
事件处理函数中,我们处理服务器发送回来的消息。
在 close
事件处理函数中,我们可以输出一条日志表示连接已关闭。
代码示例
以下是完整的代码示例,它演示了如何使用 ws
模块在 Node.js 中实现 WebSocket 服务端和客户端通信:
-- -------------------- ---- ------- -- --------- ----- --------- - -------------- ----- ------ - --- ------------------ ----- ---- --- ----------------------- -------- -- - ------------------- ------------- -------------------- ------ -- - --------------------- ---------- ------ ---------------- ----- ---------- --- ------------------ -- -- - ------------------- ---------------- --- --- -- --------- ----- --------- - -------------- ----- -- - --- --------------------------------- ------------- -- -- - ----------------------- --------------- --------------- ---------- --- ---------------- ------ -- - --------------------- ---------- ------ --- -------------- -- -- - ----------------------- ---------- ---
总结
本文介绍了 WebSocket 的基本概念和工作原理,并使用 ws
模块演示了如何使用 Node.js 实现简单的 WebSocket 服务器和客户端通信。
了解 WebSocket 技术,不仅可以为前端页面提供更流畅、更高效的交互体验,也可以为开发者的服务端开发提供更多的可能性。这对于前端工程师和全栈工程师是非常有益的。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64d103b9b5eee0b525807af3