在现代 web 应用程序中，WebSocket 已成为实时通信的最佳解决方案之一。WebSocket 协议是一种双向通信协议，可以直接在客户端和服务器之间传递数据。使用 WebSocket 协议可以轻松地实现实时通信的功能，例如聊天应用程序或多人在线游戏等。
在本文中，我们将学习如何使用 Node.js 和 Express 框架实现 WebSocket 服务。我们将深入了解 WebSocket 协议并创建一个实时聊天应用程序作为示例。
WebSocket 协议简介
WebSocket 是一个标准化的协议，用于在客户端和服务器之间进行实时通信。与传统的 HTTP 请求不同，WebSocket 首先通过 HTTP 请求进行握手，然后建立一条全双工通信通道。这允许服务器推送数据到客户端，同时客户端也可以推送数据到服务器，而不需要使用轮询或长轮询等技术。
实现 WebSocket 服务
安装 Express 和 WebSocket 模块
首先，我们需要在项目中安装 Express 和 WebSocket 模块。可以使用以下命令：
--- ------- ------- --- ------- --
创建 Express 应用程序
接下来，我们将创建一个 Express 应用程序并配置它以使用 WebSocket 服务。在 app.js 文件中添加以下代码：
----- ------- - -------------------
----- -- - --------------
----- --- - ----------
----- ------ - ---------------- -- -- -
------------------- ------- -- --------------------------------------------
---
----- --- - --- ----------- ------ ---该代码创建了一个 Express 应用程序并在端口 3000 上启动了一个 HTTP 服务器。然后我们创建了一个 WebSocket 服务器实例并将其附加到 HTTP 服务器上。
处理 WebSocket 连接
接下来，我们需要处理客户端的 WebSocket 连接。在上述代码的下面添加以下代码：
-------------------- ---- -- -
------------------- ------------
---------------- --------- -- -
--------------------- -------- -------------
---------------------------- -- -
-- ------- --- -- -- ----------------- --- -------- -
----------------------- -------------
-
---
---
---------------- -- --------- ------ -- ----- ----------
---该代码处理 WebSocket 服务器上的连接事件，并为每个连接发送欢迎消息。当接收到客户端发送的消息时，服务器会将该消息广播给所有已连接的客户端。
创建客户端
最后，我们需要创建客户端 HTML 文件并将其连接到 WebSocket 服务器。创建一个名为 index.html 的文件，里面添加以下代码：
--------- -----
------
------
---------------- ------------
-------
------
--------- ------------- --------- -------------------------
------ ----------- -----------------
------- ------------- -------------------------------------
--------
----- -- - --- ---------------------------------
------------ - ------- -- -
----- -------- - ------------------------------------
-------------- -- ---------- - -----
--
-------- ------------- -
----- ------- - -----------------------------------------
-----------------
-
---------
-------
-------该代码创建了一个简单的聊天界面，允许用户输入消息并将其发送到服务器。客户端通过 WebSocket 连接到服务器，并在接收到消息时将其添加到屏幕上的消息窗口中。
运行和测试
完成以上代码后，运行以下命令启动服务器：
---- ------
在浏览器中打开 index.html 文件可以开启一个聊天窗口。尝试在多个浏览器窗口中打开该聊天页面，然后从任何一个窗口发送消息，它都将广播到所有已连接的客户端。
在控制台中输出的日志可以方便我们追踪发送的信息。
结论
在本文中，我们学习了如何使用 Node.js 和 Express 框架建立一个 WebSocket 服务器。我们创建了一个简单的聊天应用程序以演示实时通信功能。
WebSocket 协议具有许多优点，例如可以实现实时通信和减少服务器负载等。现在，你可以使用这些知识来构建更加强大的实时应用程序。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/671cb6dc9babaf620fb219ac