Socket.IO - Hello World

在接下来的章节中，我们将讨论使用 Socket.IO 库和 ExpressJS 的基本示例。

示例

首先，创建一个名为 app.js 的文件，并输入以下代码来设置一个 Express 应用程序：

var app = require('express')();
var http = require('http').Server(app);

app.get('/', function(req, res){
   res.sendFile('E:/test/index.html');
});

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

我们需要一个 index.html 文件来提供服务，创建一个名为 index.html 的新文件，并在其中输入以下代码：

<!DOCTYPE html>
<html>
   <head><title>Hello world</title></head>
   <body>Hello world</body>
</html>

要测试它是否有效，请转到终端并使用以下命令运行此应用程序：

nodemon app.js

这将在 localhost:3000 上运行服务器。转到浏览器并输入 localhost:3000 进行检查。如果一切顺利，页面上会打印一条消息 “Hello World”。

以下是另一个示例（这需要 Socket.IO），每次用户访问此页面时，它都会记录“用户已连接”，并且每次有人离开/关闭此页面时，都会记录“用户已断开连接”。

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.get('/', function(req, res){ res.sendFile('E:/test/index.html');
});

//Whenever someone connects this gets executed
io.on('connection', function(socket){
   console.log('A user connected');
   
   //Whenever someone disconnects this piece of code executed
   socket.on('disconnect', function () {
      console.log('A user disconnected');
   });
});
http.listen(3000, function(){
   console.log('listening on *:3000');
});

require('socket.io')(http) 创建一个新的 socket.io 实例，并将其附加到 http 服务器。io.on 事件处理程序在其中使用 socket 对象处理连接、断开连接等事件。

我们已将服务器设置为在连接和断开连接时记录消息。现在我们必须包含客户端脚本并在其中初始化 socket 对象，以便客户端在需要时可以建立连接。该脚本由我们的 io 服务器在 '/socket.io/socket.io.js' 提供服务。

完成上述步骤后，index.html 文件将如下所示：

<!DOCTYPE html>
<html>
   <head><title>Hello world</title></head>
   <script src="/socket.io/socket.io.js"></script>
   <script>
      var socket = io();
   </script>
   <body>Hello world</body>
</html>

如果您现在转到 localhost:3000（确保您的服务器正在运行），您将在浏览器中看到打印出的 Hello World。现在检查您的服务器控制台日志，它将显示以下消息：

A user connected

如果您刷新浏览器，它将断开 socket 连接并重新创建。您可以在控制台日志中看到以下内容：

A user connected
A user disconnected
A user connected

打印页面