Socket.IO - Hello World

创建一个名为 app.js 的文件并输入以下代码来设置快速应用程序 -

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

app.get('/', function(req, res) {
   res.sendfile('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 进行检查。

这将设置我们的快速应用程序,现在在根路由上提供HTML文件。现在,每当有人导航/关闭此页面时,每当用户访问此页面并且“用户断开连接”时,我们将需要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('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) 创建一个连接到http服务器的新socket.io实例。该 io.on事件处理程序处理连接,断线等事件,使用Socket对象。

我们已经设置了服务器来记录连接和断开连接的消息。我们现在必须包含客户端脚本并在那里初始化 Sockets 对象,以便客户端可以在需要时建立连接。该脚本由我们的 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

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

A user connected
A user disconnected
A user connected

我们现在有 Sockets 连接工作。这能看出在 Socket.IO 中设置连接是多么的容易。