简介
wss 是一个基于 WebSocket 的轻量级、简单易用的 WebSocket 服务器库,使用 Node.js 编写。可以通过 npm 下载并安装。
本文将详细介绍如何安装和使用 wss。
安装
你需要先安装 Node.js 和 npm,如果你已经安装过了,直接在终端输入以下命令即可安装 wss:
npm install wss
使用方法
首先,我们需要引入 wss:
const WebSocket = require('wss')
使用 wss 创建 WebSocket 服务器的代码如下:
-- -------------------- ---- ------- ----- --------- - -------------- ----- ------ - --- ------------------ ----- ---- -- ----------------------- -------- -------- - ------------------- ----------- -------------------- -------- --------- - ---------------------- - - -------- -- -------- ---------------- ---- -------- - - -------- -- ------------------ -------- -- - ------------------- -------------- -- --
上述代码创建了一个监听 8080 端口的 WebSocket 服务器。connection
事件监听客户端连接,message
事件监听客户端发送的消息,close
事件监听客户端断开连接。
可以使用浏览器的 WebSocket API 连接到我们的服务器:
-- -------------------- ---- ------- ----- ------ - --- -------------------------------- ------------------------------- -------- ------- - ---------------------- -- -------- ------------------ -------- -- ---------------------------------- -------- ------- - --------------------- ---- ------- - - ----------- -- -------------------------------- -------- ------- - ------------------------- ---- -------- --
当连接成功时,会触发 open
事件,我们发送一段消息给服务器。当服务器收到消息后,会触发 message
事件,我们在这里处理服务器返回的消息。当连接断开时,会触发 close
事件。
除此之外,wss 还提供了一些其他的 API,如向所有已连接的客户端广播消息:
server.clients.forEach(function (client) { client.send('Hello all') })
示例代码
下面是一个完整的例子,在终端输入以下命令启动服务器:
node server.js
server.js 内容如下:
-- -------------------- ---- ------- ----- --------- - -------------- ----- ------ - --- ------------------ ----- ---- -- ----------------------- -------- -------- - ------------------- ----------- -------------------- -------- --------- - ---------------------- - - -------- -- -------- ---------------- ---- -------- - - -------- -- ---- ------------------------------- -------- - -- ------- --- ------- - ----------------------- - - -------- - -- -- ------------------ -------- -- - ------------------- -------------- -- --
在浏览器输入 http://localhost:8080
,在控制台输入以下代码连接服务器:
-- -------------------- ---- ------- ----- ------ - --- -------------------------------- ------------------------------- -------- ------- - ---------------------- -- -------- ------------------ -------- -- ---------------------------------- -------- ------- - --------------------- ---- ------- - - ----------- -- -------------------------------- -------- ------- - ------------------------- ---- -------- --
连接成功后,你可以在控制台看到输出的日志,并且可以通过浏览器的 Network 选项卡查看通信数据。
总结
本文详细介绍了 npm 包 wss 的安装和使用方法,并提供了示例代码,方便读者学习和实践。WebSocket 作为现代 Web 开发中不可或缺的一部分,相信学习 wss 会对你的前端技能有所提升。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/600671188dd3466f61ffe747