Socket.io向所有客戶端發射按鈕按下

Question

將按鈕狀態發送到連接到服務器的所有客戶端時遇到麻煩。 我正在嘗試使用express和socket.io打開樹莓派托管服務器的指示燈。

我首先單擊客戶端上的按鈕，它將按鈕的狀態發送到我的服務器，然后服務器將其發送給所有客戶端，單擊所有客戶端頁面上的按鈕，然后按鈕陷入無限循環並繼續單擊。

我做的過程正確嗎？ 我可以找到許多向所有客戶端發出信號的示例，但是找不到任何能夠發出按鈕狀態的示例。 我也嘗試了emit.broadcast，但是兩個客戶端輪流發送按鈕狀態。

有沒有人建議解決此問題？ 謝謝！

服務器端代碼：

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

var onoff = require('onoff'); 
var Gpio = onoff.Gpio;
var light = new Gpio(13, 'out');


app.use(express.static(__dirname + '/'));  
app.get('/', function(req, res,next) {  
res.sendFile(__dirname + '/brew.html');
 });

console.log('Starting Server...');

  var io = require('socket.io').listen(server);
  io.sockets.on('connection', function (client) {

  client.on('lightOn',function(on){
    light.writeSync(1);
    io.emit('lightOn');
  });
  client.on('lightOff',function(off){
    light.writeSync(0);
    io.emit('lightOff');
   });
  });

 server.listen(3000);

 function lightOn(){
 light.writeSync(1);
 }
   function lightOff(){
   light.writeSync(0);
  }

客戶代碼：

  <h3 id="h3Brew">Light</h3>
  <input type="checkbox" data-toggle="toggle" data-on="Off" data-off="On" id="toggle">

  <script>
  var socket = io.connect();
  $(function() {
  $('#toggle').bootstrapToggle({
      on: 'ON',
      off: 'OFF'
    });
  })
        $("#toggle").change(function(){
          if($("#toggle").prop("checked") == true){
           socket.emit('lightOn', 'on\n');
          }else{
           socket.emit('lightOff', 'off\n');}
         });

        socket.on('lightOn', function() {
          $('#toggle').bootstrapToggle('on');
        });
         socket.on('lightOff', function() {
          $('#toggle').bootstrapToggle('off');
        });

    </script>

Answer 1

使用全局變量來區分由襪子觸發的更改事件和由用戶觸發的更改事件

您可以嘗試這樣的事情

var websocket = false;
$("#toggle").change(function(){
      if(!websocket) {
          if($("#toggle").prop("checked") == true){
           socket.emit('lightOn', 'on\n');
          }else{
           socket.emit('lightOff', 'off\n');}
      } else {websocket = false;}
         });

        socket.on('lightOn', function() {
          websocket = true;
          $('#toggle').bootstrapToggle('on');
        });
         socket.on('lightOff', function() {
          websocket = true;
          $('#toggle').bootstrapToggle('off');

        });