- Socket.IO 教程
- Socket.IO - 首页
- Socket.IO - 概览
- Socket.IO - 环境
- Socket.IO - Hello world
- Socket.IO - 事件处理
- Socket.IO - 广播
- Socket.IO - 署名空间
- Socket.IO - 房间
- Socket.IO - 错误处理
- Socket.IO - 日志记录和调试
- Socket.IO - 内部部分
- Socket.IO - 聊天应用程序
- Socket.IO 有用资源
- Socket.IO - 快速指南
- Socket.IO - 有用资源
- Socket.IO - 讨论
Socket.IO - 广播
广播是指向所有已连接的客户端发送消息。广播可以在多个级别进行。我们可以向所有已连接的客户端、那些位于署名空间内的客户端以及位于特定房间内的客户端发送消息。要向所有客户端广播事件,我们可以使用 io.sockets.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('E:/test/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 world</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 world</body> </html>
如果你连接四个客户端,将获得以下结果 −
这是向每个人发送事件。现在,如果我们希望向每个人发送事件,但跳过导致事件的客户端(在上一个示例中,这是由此连接的新客户端导致的),我们可以使用 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('E:/test/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 world</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 world</body> </html>
现在,最新客户端获得欢迎消息,而其他客户端获得当前连接到服务器的客户端数。
广告