Socket.io向所有客户端发射按钮按下 [英] Socket.io emit button press to all clients

问题描述

在将按钮状态发送到连接到服务器的所有客户端时遇到一些麻烦.我正在尝试使用express和socket.io打开树莓派托管服务器的灯光.

I am having some trouble sending a button state to all clients connected to my server. I am trying to turn on a light from a raspberry pi hosted server using express and socket.io.

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

I first click the button from the client and it will send the state of the button to my server which then emits it to all clients which clicks the button on all clients page but then button then gets stuck in an endless loop and continues to click.

我正在执行的过程是否正确?我可以找到许多向所有客户端发出信号的示例，但找不到任何能够发出按钮状态的示例.我也尝试了emit.broadcast，但是两个客户端轮流发送按钮状态.

Is the process that I am doing correct? I can find lots of examples of emitting to all clients but I am unable to find any that emit the state of a button. I also tried to emit.broadcast but the two clients took turns sending the button state endlessly.

有人对解决此问题有任何建议吗? 谢谢！

Does anyone have any suggestions for fixing this problem? Thanks!

服务器端代码:

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>

推荐答案

使用全局变量来区分袜子和用户触发的更改事件

Use a global variable to differentiate between a change event triggered by the socked and one triggered by the user

您可以尝试这样的事情

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

        });

这篇关于Socket.io向所有客户端发射按钮按下的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！