WebSocket 是一种在 Web 应用程序中实现实时通信的协议，它允许客户端和服务器之间进行双向通信，而不需要通过 HTTP 请求和响应。在前端开发中，我们经常需要实现实时通信来更新数据或显示通知。在本文中，我们将介绍如何在 Express.js 中使用 WebSocket 实现实时通信。
前置知识
在阅读本文之前，你需要了解以下知识：
- JavaScript 基础知识
- Node.js 和 Express.js 的基础知识
- WebSocket 的基础知识
安装 WebSocket
在 Express.js 中使用 WebSocket，我们需要使用一个 WebSocket 库。在本文中，我们将使用 ws 库。你可以使用 npm 安装它：
--- ------- --
创建 WebSocket 服务器
我们可以使用 ws 库创建一个 WebSocket 服务器。在 Express.js 中，我们需要在应用程序中添加 WebSocket 服务器的代码。以下是一个简单的例子：
----- --------- - --------------
----- --- - --- ------------------ ----- ---- ---
-------------------- -------- -------------- -
------------------- ------------
---------------- -------- ----------------- -
---------------------- ---- ---------
---
--------------- ----------
---在这个例子中，我们创建了一个 WebSocket 服务器，并将其绑定到 8080 端口。当客户端连接到服务器时，服务器会打印出 "Client connected" 消息。当客户端发送消息时，服务器会打印出接收到的消息。服务器也会向客户端发送一条欢迎消息。
在 Express.js 应用程序中使用 WebSocket
现在我们已经创建了一个 WebSocket 服务器，让我们将其集成到 Express.js 应用程序中。以下是一个简单的例子：
----- ------- - -------------------
----- ---- - ----------------
----- --------- - --------------
----- --- - ----------
----- ------ - -----------------------
----- --- - --- ------------------ ------ ---
------------ -------- ----- ---- -
---------------------- - ---------------
---
-------------------- -------- -------------- -
------------------- ------------
---------------- -------- ----------------- -
---------------------- ---- ---------
---
--------------- ----------
---
------------------- -------- -- -
---------------------- -- ------------------------
---在这个例子中，我们首先创建了一个 Express.js 应用程序和一个 HTTP 服务器。我们将 WebSocket 服务器绑定到 HTTP 服务器上。然后我们定义了一个路由，当客户端访问根路由时，服务器会发送一个 HTML 文件。最后，我们定义了 WebSocket 服务器的连接事件，当客户端连接到服务器时，服务器会打印出 "Client connected" 消息，并向客户端发送一条欢迎消息。
在客户端使用 WebSocket
现在我们已经创建了一个 WebSocket 服务器并将其集成到 Express.js 应用程序中，让我们编写客户端代码来连接服务器。以下是一个简单的例子：
--------- -----
------
------
----- ----------------
---------------- ---------------
-------
------
--------
----- -- - --- ---------------------------------
--------- - -------- -- -
---------------------- -- --------- ---------
--
------------ - -------- ------- -
---------------------- - - ------------
--
---------- - -------- -- -
------------------------- ---- --------- ---------
--
---------
-------
-------在这个例子中，我们创建了一个 WebSocket 对象，并将其连接到我们的服务器。当客户端连接到服务器时，客户端会打印出 "Connected to WebSocket server" 消息。当客户端接收到消息时，客户端会打印出接收到的消息。当客户端断开连接时，客户端会打印出 "Disconnected from WebSocket server" 消息。
总结
在本文中，我们介绍了如何在 Express.js 中使用 WebSocket 实现实时通信。我们使用了 ws 库创建了一个 WebSocket 服务器，并将其集成到 Express.js 应用程序中。我们还编写了客户端代码来连接服务器并接收消息。WebSocket 是一种非常有用的技术，它可以帮助我们实现实时通信和更新数据。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/66024f87d10417a222dd22ea