Socket.io向所有客户端发射按钮

Socket.io向所有客户端发射按钮

问题描述:

我在向连接到服务器的所有客户端发送按钮状态时遇到了一些麻烦。我正尝试使用express和socket.io打开来自覆盆子pi托管服务器的光。Socket.io向所有客户端发射按钮

我首先点击客户端的按钮,它会将按钮的状态发送到我的服务器,然后将它发送给所有客户端,所有客户端点击所有客户端页面上的按钮,然后按钮然后陷入无限循环,继续点击。

我正在做的过程是否正确?我可以找到很多向所有客户端发布的示例,但我无法找到任何能够发出按钮状态的示例。我也尝试发射.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> 
+0

我想'$('#toggle')。bootstrapToggle('on');'触发#toggle改变事件,所以你基本上有一个无限循环 – madalinivascu

+0

感谢您的回应。我现在肯定看到了这个问题。您是否知道向所有客户端发布按钮的正确方法? – pshutt

使用全局变量一个由用户触发由停飞引发了变化事件,并区分

你可以尝试这样的事情

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

     }); 
+1

它的工作原理!谢谢! – pshutt