Express.js 中如何使用 Socket.IO 进行即时通信-JavaScript中文网-JavaScript教程资源分享门户

Socket.IO 是一个基于 Node.js 的实时 web 应用程序框架，可以用来实现即时通信。在 Express.js 中使用 Socket.IO，可以方便地实现实时通信功能，例如在线聊天、实时更新等。

安装 Socket.IO

在 Express.js 中使用 Socket.IO，需要先安装 Socket.IO。可以使用 npm 命令安装：

npm install socket.io

在 Express.js 中使用 Socket.IO

安装 Socket.IO 后，可以在 Express.js 应用程序中使用 Socket.IO。首先需要在应用程序中引入 Socket.IO 模块：

const app = require('express')();
const http = require('http').createServer(app);
const io = require('socket.io')(http);

然后可以定义 Socket.IO 的事件监听器，例如监听连接事件：

io.on('connection', (socket) => {
  console.log('a user connected');
});

在连接事件中，可以定义其他事件监听器，例如监听消息事件：

io.on('connection', (socket) => {
  console.log('a user connected');
  socket.on('message', (msg) => {
    console.log('message: ' + msg);
  });
});

在监听器中，可以使用 Socket.IO 的 API，例如发送消息：

io.on('connection', (socket) => {
  console.log('a user connected');
  socket.on('message', (msg) => {
    console.log('message: ' + msg);
    io.emit('message', msg);
  });
});

在发送消息时，可以使用 io.emit() 方法向所有连接的客户端发送消息。

示例代码

下面是一个使用 Express.js 和 Socket.IO 实现的简单聊天室应用程序的示例代码：

const app = require('express')();
const http = require('http').createServer(app);
const io = require('socket.io')(http);

app.get('/', (req, res) => {
  res.sendFile(__dirname + '/index.html');
});

io.on('connection', (socket) => {
  console.log('a user connected');
  socket.on('message', (msg) => {
    console.log('message: ' + msg);
    io.emit('message', msg);
  });
});

http.listen(3000, () => {
  console.log('listening on *:3000');
});

在该应用程序中，客户端可以通过向服务端发送消息来实现聊天功能。客户端代码如下：

<!DOCTYPE html>
<html>
  <head>
    <title>Socket.IO Chat Example</title>
    <script src="/socket.io/socket.io.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  </head>
  <body>
    <ul id="messages"></ul>
    <form action="">
      <input id="input" autocomplete="off" /><button>Send</button>
    </form>
    <script>
      const socket = io();
      $('form').submit((e) => {
        e.preventDefault(); // prevents page reloading
        socket.emit('message', $('#input').val());
        $('#input').val('');
        return false;
      });
      socket.on('message', (msg) => {
        $('#messages').append($('<li>').text(msg));
      });
    </script>
  </body>
</html>

在客户端代码中，通过使用 Socket.IO 的 API 来实现消息的发送和接收。

总结

使用 Socket.IO 可以方便地实现 Express.js 应用程序的实时通信功能。通过定义事件监听器和使用 Socket.IO 的 API，可以实现在线聊天、实时更新等功能。在使用 Socket.IO 时，需要注意安全性和性能。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/658e8e34eb4cecbf2d46f1eb