前言
在 Web 开发中，实时通信是一个非常重要的功能。socket.io 是一个流行的实时通信库，它允许客户端和服务器之间进行双向通信。本文将介绍 socket.io 的事件监听及使用方法，帮助读者更好地理解和使用该库。
事件监听
在 socket.io 中，事件是实现双向通信的基础。客户端和服务器都可以监听和触发事件。下面是一些常用的事件：
服务器端事件
connection
当客户端连接到服务器时，会触发 connection 事件。该事件的回调函数会接收一个 socket 参数，表示与客户端建立的连接。下面是一个例子：
----- -- - ----------------------- ------------------- -------- -- - -------------- ---- ------------ ---
disconnect
当客户端断开与服务器的连接时，会触发 disconnect 事件。该事件的回调函数会接收一个 socket 参数，表示断开连接的客户端。下面是一个例子：
------------------- -------- -- -
----------------------- -- -- -
----------------- ---------------
---
---自定义事件
除了上述两个事件，我们还可以自定义事件。服务器可以使用 socket.emit() 方法触发事件，客户端可以使用 socket.on() 方法监听事件。下面是一个例子：
------------------- -------- -- -
--------------- --------- ----- -- -
--------------------- ---------
------------- --------- -----
---
---上述代码中，服务器监听 chat message 事件，当有客户端触发该事件时，服务器会将消息广播给所有客户端。客户端可以使用以下代码监听该事件：
----- ------ - ----- --------------- --------- ----- -- - --------------------- --------- ---
客户端事件
客户端也可以触发事件，服务器可以使用 socket.on() 方法监听事件。下面是一个例子：
----- ------ - ----- ----------------- --------- ------ --------
上述代码中，客户端触发 chat message 事件，并将消息发送给服务器。服务器可以使用以下代码监听该事件：
------------------- -------- -- -
--------------- --------- ----- -- -
--------------------- ---------
---
---使用方法
要使用 socket.io，我们需要先安装它。可以使用以下命令安装：
--- ------- ---------
服务器端
在服务器端，我们需要创建一个 socket.io 实例，并监听连接事件。下面是一个例子：
----- -- - ----------------------- ------------------- -------- -- - -------------- ---- ------------ --- ----------------
上述代码中，我们创建了一个 socket.io 实例，并监听连接事件。最后使用 listen() 方法将服务器绑定到端口 3000。
客户端
在客户端，我们需要在 HTML 文件中引入 socket.io 库，并创建一个 socket 实例。下面是一个例子：
------- ---------------------------------------
--------
----- ------ - -----
-------------------- -- -- -
-------------------------
---
----------------------- -- -- -
----------------------------
---
---------上述代码中，我们引入了 socket.io 库，并创建了一个 socket 实例。我们可以监听 connect 和 disconnect 事件，以便在连接状态发生变化时得到通知。
总结
本文介绍了 socket.io 的事件监听及使用方法。socket.io 是一个功能强大的实时通信库，可以帮助开发者轻松实现双向通信。希望读者通过本文的介绍，能够更好地理解和使用该库。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6516157695b1f8cacde6d351