在 Web 应用程序中，有时候需要实时通知用户一些重要的事件，例如新消息、系统更新等等。传统的 HTTP 请求-响应模式并不能满足这种需求，因为它总是由客户端向服务器发送请求，服务器才会响应客户端请求。这意味着客户端必须持续地向服务器发送请求，以获得最新的状态数据，这对于服务器和客户端都是低效而且没有必要的。
为了解决这个问题，我们可以使用 Socket.io 技术。Socket.io 是一个提供实时双向通信的 JavaScript 库，它使用了 WebSocket 技术和其他协议来实现跨平台的实时应用程序。它可以在 Express 应用程序中使用，并提供了许多有用的功能，例如广播、加入和离开房间、连接和断开连接通知等等。
步骤一：创建 Express 应用程序
首先，在命令行中使用命令 npm init 创建一个新的 Node.js 应用程序，然后安装 Express 和 Socket.io：
npm install express socket.io --save
然后，在应用程序的主文件中 app.js 中定义一个新的 Express 应用程序：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- --- - ---------- ------------ ----- ---- -- - --------------- --------- --- ---------------- -- -- - -------------------- --- --------- -- ---- -------- ---
这个应用程序使用 Express 框架，在主页上发送 'Hello World!' 消息来响应 GET 请求。
步骤二：集成 Socket.io
接下来，我们需要集成 Socket.io 到这个应用程序中。我们可以通过以下方式来对 Express 应用程序进行改造：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- --- - ---------- ----- ------ - ---------------------------------- ----- -- - ----------------------------- ------------ ----- ---- -- - --------------- --------- --- ------------------- -------- -- - -------------- ---- ------------ --- ------------------- -- -- - -------------------- --- --------- -- ---- -------- ---
这段代码使用了 http 模块创建了一个新的服务器并使用 socket.io 集成了这个服务器。io.on('connection') 流程表示当有新的客户端连接到服务器时调用的回调函数。当用户连接时，我们将在控制台中打印出 'a user connected' 消息。
步骤三：发送实时事件
现在我们可以使用 socket.emit() 方法向客户端发送实时事件。例如，我们可以在客户端连接时发送一个叫做 'welcome' 的事件：
io.on('connection', (socket) => {
console.log('a user connected');
socket.emit('welcome', 'Hello, user!');
});在客户端中，我们可以使用 socket.on() 方法来监听这个事件并显示消息：
const socket = io();
socket.on('welcome', (msg) => {
console.log(msg); // 输出 'Hello, user!'
});这个代码片段定义了一个新的 socket 连接，并使用 socket.on() 方法来监听 'welcome' 事件。当事件触发时，会打印消息 'Hello, user!'。
步骤四：广播事件
我们还可以使用 io.emit() 方法发送信息给所有连接的客户端。例如，我们可以在客户端连接时向所有客户端发送 'user connected' 消息：
io.on('connection', (socket) => {
console.log('a user connected');
io.emit('user connected', 'A new user is connected!');
});在客户端中，我们可以使用同样的 socket.on() 方法来监听 'user connected' 事件并显示消息：
const socket = io();
socket.on('user connected', (msg) => {
console.log(msg); // 输出 'A new user is connected!'
});这个代码片段在客户端连接上时，向所有客户端发送 'user connected' 事件。当事件触发时，所有客户端都将收到消息 'A new user is connected!'。
总结
在本文中，我们学习了如何使用 Socket.io 在 Express 应用程序中实现实时事件通知。我们从创建新的 Express 应用程序开始，然后使用 Socket.io 集成了这个应用程序，最后使用 socket.emit() 和 io.emit() 方法实现了实时消息通知。这个技术对于实现实时应用程序非常有用，例如在线聊天、多人游戏和实时仪表盘等等。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c713d510032fedd3905f7c