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>

現在，最新客戶端獲得歡迎訊息，而其他客戶端獲得當前連線到伺服器的客戶端數。

列印頁面