介绍
express-ws 是一个 Node.js 的 npm 包,它为 Express 框架添加了 WebSocket 功能。WebSocket 是一种基于 TCP 协议的全双工通信协议,它可以在客户端和服务器之间建立长连接,实现实时通信。express-ws 提供了一种简便的方式来实现 WebSocket 应用。
本文将介绍如何使用 express-ws 构建 WebSocket 应用。
安装
可以通过 npm 来安装 express-ws:
--- ------- ----------
创建 WebSocket 应用
引入模块
首先需要引入 express 和 express-ws 模块:
----- ------- - ------------------- ----- --------- - ----------------------
初始化应用
然后初始化 express 应用并将其传递给 express-ws:
----- --- - ---------- ----- -- - ---------------
添加 WebSocket 路由
接着需要添加 WebSocket 的路由:
-------------------- ---- ---- -- - -- -- --------- -- ---
app.ws()
方法和 app.get()
、app.post()
等方法类似,可以用来定义路由。当客户端连接到 /websocket
路径时,将会执行回调函数。
在回调函数中,第一个参数 ws
表示 WebSocket 实例,第二个参数 req
表示请求对象。
处理 WebSocket 请求
在 WebSocket 路由的回调函数中,可以监听一些事件来处理 WebSocket 请求。例如:
-------------------- ---- ---- -- - ---------------- ----- -- - --------------------- -------- --------- ------------ ----- --------- --- ---
在这个例子中,当客户端发送消息时,服务器会打印出接收到的消息,并将消息原样返回给客户端。
发送消息
在回调函数中,可以使用 ws.send()
方法向客户端发送消息。例如:
-------------------- ---- ---- -- - --------------- --------- ---
此时,当客户端连接到 /websocket
路径时,将会收到一条消息:Hello, world!。
示例代码
以下是一个简单的 express-ws 应用示例:
----- ------- - ------------------- ----- --------- - ---------------------- ----- --- - ---------- ----- -- - --------------- -------------------- ---- ---- -- - ---------------------- ---------- -------------- ---------------- ----- -- - --------------------- -------- --------- ------------ ----- --------- --- -------------- -- -- - ---------------------- ---------- --------- --- ------------------ ---------- -------------- --- ---------------- -- -- - ------------------- ------- -- ---- ------- ---
在这个示例中,当客户端连接到 /websocket
路径时,服务器会打印出一条消息,表示 WebSocket 连接已建立。然后当客户端发送消息时,服务器会打印出接收到的消息,并将消息原样返回给客户端。最后当客户端关闭连接时,服务器会打印出一条消息,表示 WebSocket 连接已关闭。
总结
通过本文介绍,我们学习了如何使用 npm 包 express-ws 来构建 WebSocket 应用。express-ws 为 Express 框架添加了 WebSocket 功能,使得开发 WebSocket 应用变得更加简单。
在实际开发中,我们可以根据自己的需求来扩展 WebSocket 应用的功能。例如,可以在回调函数中加入业务逻辑,从而实现实时通信、在线聊天等功能。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/54676