在前端开发中，经常需要使用 WebSocket 实现实时通信。而 osnova-module-socket.io 正是一个方便易用的 WebSocket 库。本文将详细介绍 osnova-module-socket.io 的使用方法。
安装
在开始使用 osnova-module-socket.io 之前，需要在项目中先安装该 npm 包。可以使用以下命令进行安装：
npm install osnova-module-socket.io
初始化 WebSocket 服务器
首先，我们需要初始化一个 WebSocket 服务器。可以使用以下代码：
-- -------------------- ---- -------
----- ------ - ------------------
----- -------------- - -----------------------------------
----- ------ - ---------
----- -- - -----------------------
------------------- -------- -- -
-------------- ---- ------------
----------------------- -- -- -
----------------- ---------------
---
---在实现以上代码后，我们便完成了一个简单的 WebSocket 服务器的初始化工作。其中，io.on('connection', (socket) => {...})是监听客户端连接的事件，当客户端连接成功后，会输出一条 a user connected 的控制台信息。socket.on('disconnect', () => {...}) 则是监听客户端断开连接的事件，当客户端断开连接时，会输出一条 user disconnected 的信息。
客户端连接
接下来，我们需要编写前端页面，与 WebSocket 服务器建立连接。首先，我们需要在 HTML 中引入资源文件：
<script src="/socket.io/socket.io.js"></script>
注意，这里的文件路径与你项目的实际路径有关。
接着，我们需要使用以下代码与服务器建立连接：
-- -------------------- ---- ------- ----- ------ - ---------------------------- -------------------- -- -- - ---------------------- -- --------- --- ----------------------- -- -- - ------------------------- ---- --------- ---
在以上代码中，我们将 http://localhost:3000 作为参数传给 io() 函数，以建立与服务器的连接。当连接成功时，会输出 connected to server 的控制台信息。当连接断开时，会输出 disconnected from server 的信息。
发送消息
连接建立后，我们可以使用以下代码来发送消息：
socket.emit('chat message', 'Hello, world!');这里的 'chat message' 是自定义的事件名称，可以根据需要进行修改。接收消息的代码如下：
socket.on('chat message', (msg) => {
console.log(msg);
});当接收到消息时，会输出消息内容。
广播消息
除了与单个客户端的通信外，我们还可以使用下面的代码，向所有客户端广播消息：
io.emit('chat message', 'Hello, world!');当所有客户端收到消息时，会输出消息内容。
结束
到此为止，我们已经学习了 osnova-module-socket.io 的基本用法。希望这篇文章对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005538f81e8991b448d0c09