Socket.io 是一个用于 Websocket 的 JavaScript 库，可以实现实时通信。本文将介绍如何使用 Socket.io 实现移动端实时聊天功能。
准备工作
在开始之前，需要先安装 Node.js 和 Express。在命令行中执行以下命令：
npm install --save express npm install --save socket.io
接下来创建一个新的 Express 应用程序，并创建一个 index.html 文件作为前端界面。
实现服务端
在服务器端，我们需要处理三个事件：
connection: 当客户端连接到服务器时触发chat message: 当客户端发送消息时触发disconnect: 客户端断开连接时触发
以下是服务器端代码的基本框架：
-- -------------------- ---- -------
----- --- - ---------------------
----- ---- - ----------------------------------
----- -- - ---------------------------
------------------- -------- -- -
-------------- ---- ------------
--------------- --------- ----- -- -
--------------------- - - -----
------------- --------- -----
---
----------------------- -- -- -
----------------- ---------------
---
---
----------------- -- -- -
---------------------- -- ---------
---在 connection 事件中，我们记录客户端连接，并在断开连接时记录客户端断开连接。
在 chat message 事件中，我们将消息发送到服务器，并用 io.emit 将消息发送到所有连接的客户端。
实现客户端
在客户端，我们需要处理两个事件：
connect: 客户端连接到服务器时触发chat message: 收到消息时触发
以下是客户端代码的基本框架：
-- -------------------- ---- ------- ----- ------ - ----- ------------------- -- - ----------------- --------- --------------- ---------------- ------ ------ --- --------------- --------- ----- -- - ------------------------------------------- ---
当用户发送消息时，我们使用 socket.emit 将消息发送到服务器。我们还清空输入框以准备下一条消息。
当收到消息时，我们将其添加到消息列表中。
示例代码
完整的示例代码请参考以下代码：
index.html：
-- -------------------- ---- -------
--------- -----
------
------
---------------- ---- ---------------
-------
- -
------- --
-------- --
----------- -----------
-
---- -
----- ---- ---------- ------
-
---- -
-------- -----
-
----- -
---------- --
------- -----
-------- -----
---------- -----
-------------- --- - - ----
-
------ -
------- -----
-------- -----
---------- -----
----------------- --------
------ -----
-------------- - --- --- --
------- --------
-
-- -
----------- -----
-------- -----
-
-- -
-------------- ----
-
--------
-------
------
--- -------------------
----- ----------
------ ------ ------------------ -----------------------
-------
------- ---------------------------------------
------- -----------------------------------------------------------
--------
----- ------ - -----
------------------- -- -
----------------- --------- ---------------
----------------
------ ------
---
--------------- --------- ----- -- -
-------------------------------------------
---
---------
-------
-------app.js：
-- -------------------- ---- -------
----- --- - ---------------------
----- ---- - ----------------------------------
----- -- - ---------------------------
------------ ----- ---- -- -
---------------------- - ---------------
---
------------------- -------- -- -
-------------- ---- ------------
--------------- --------- ----- -- -
--------------------- - - -----
------------- --------- -----
---
----------------------- -- -- -
----------------- ---------------
---
---
----------------- -- -- -
---------------------- -- ---------
---总结
本文介绍了如何使用 Socket.io 实现移动端实时聊天功能，包括准备工作、实现服务端和实现客户端。希望本文能够对您有所帮助，如果您有任何疑问或建议，请在评论中留言。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6471ce90968c7c53b0fb614d