Socket.IO - 广播服务

Socket.IO - 广播服务 首页 / Socket.io入门教程 / Socket.IO - 广播服务

Broadcasting意味着向所有连接的客户端发送消息,我们可以将消息发送给所有连接的客户端,我们可以使用 io.sockets.emit 方法。

注意-这将向所有连接的客户端 ALL 发出事件(该事件可能触发了此事件的Socket)。

在此示例中,我们将向所有用户广播已连接客户端的数量。更新 app.js 文件以合并以下内容。

链接:https://www.learnfk.comhttps://www.learnfk.com/socket.io/socket.io-broadcasting.html

来源:LearnFk无涯教程网

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');
});

var clients = 0;
io.on('connection', function(socket) {
   clients++;
   io.sockets.emit('broadcast',{ description: clients + ' clients connected!'});
   socket.on('disconnect', function () {
      clients--;
      io.sockets.emit('broadcast',{ description: clients + ' clients connected!'});
   });
});

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

在客户端,我们只需要处理广播事件-

<!DOCTYPE html>
<html>
   <head>
      <title>Hello Learnfk</title>
   </head>
   <script src="/socket.io/socket.io.js"></script>
   <script>
      var socket=io();
      socket.on('broadcast',function(data) {
         document.body.innerHTML='';
         document.write(data.description);
      });
   </script>
   <body>Hello Learnfk</body>
</html>

如果连接四个客户端,您将得到以下输出:

Broadcast to all

这是为了向所有人发送事件。现在,如果我们想向所有人发送事件,但引发事件的客户端,则可以使用 socket.broadcast.emit 。

无涯教程网

让我们向新用户发送欢迎消息,并向其他客户更新有关其加入的信息。因此,在您的app.js文件中,在客户端连接时向他发送欢迎消息,并将连接的客户端广播给所有其他客户端。

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');
});

var clients = 0;
io.on('connection', function(socket) {
   clients++;
   socket.emit('newclientconnect',{ description: 'Hey, welcome!'});
   socket.broadcast.emit('newclientconnect',{ description: clients + ' clients connected!'})
   socket.on('disconnect', function () {
      clients--;
      socket.broadcast.emit('newclientconnect',{ description: clients + ' clients connected!'})
   });
});

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

HTML来处理此事件-

<!DOCTYPE html>
<html>
   <head>
      <title>Hello Learnfk</title>
   </head>
   <script src="/socket.io/socket.io.js"></script>
   <script>
      var socket=io();
      socket.on('newclientconnect'function(data) {
         document.body.innerHTML='';
         document.write(data.description);
      });
   </script>
   <body>Hello Learnfk</body>
</html>

现在,最新的客户端将收到欢迎消息,其他客户端将获得当前连接到服务器的客户端数量。

祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)

技术教程推荐

Python核心技术与实战 -〔景霄〕

后端技术面试 38 讲 -〔李智慧〕

Go 并发编程实战课 -〔晁岳攀(鸟窝)〕

Spark核心原理与实战 -〔王磊〕

分布式金融架构课 -〔任杰〕

代码之丑 -〔郑晔〕

HarmonyOS快速入门与实战 -〔QCon+案例研习社〕

攻克视频技术 -〔李江〕

JavaScript进阶实战课 -〔石川〕

好记忆不如烂笔头。留下您的足迹吧 :)