Socket.emit带来了多个值

3

在socket.on内部使用socket.emit时,每次发射后都会连接相同的值。以下是我的服务器端代码:

io.on('connection', function(socket){
let balance = 6000;


console.log('a user connected');

  socket.on('giveValue',function(data){
        if(data.msg==="New Value"){
          let x = Math.floor(Math.random() * 100 - 50);
          balance += x;
          socket.emit('takeValue',{balance:balance,value:x});
        }
  });

  socket.on('disconnect',function(){
      console.log('User disconnected');
  });
  socket.on('getBalance',(data)=>{
    if(data.msg==='bringBalance'){
      socket.emit('ubalance',{data:balance});
    }
  })

});

这个是客户端的代码,我使用的是 Angular 6

constructor() {
    this.socket = io('http://localhost:4000');
  }

  ngOnInit() {
    this.socket.emit('getBalance',{msg:"bringBalance"});
    this.socket.on('ubalance',(data)=>{
      console.log(data);
      this.balance=data.data;
    });
  }

  getSum(event) {
    this.socket.open();
    this.socket.emit('giveValue',{msg:"New Value"});
    this.socket.on('takeValue', (data) => {
       this.balance=data.balance;
       console.log("Value====="+data.value) + "\n";
       console.log("Balance======"+data.balance);

    });
  }

每次点击后,会运行getSum()函数并在后端生成随机值,将其添加到余额中。所有这些都是在我的后端进行的。 问题在于socket.on("takeValue")每次点击之后都会带来一个相同的值。我该如何解决这个问题?对于我的语言错误,我很抱歉,希望你能理解我。感谢你的关注和帮助。
1个回答

3

您的问题在于您在函数内部声明了.on事件,并且每次运行函数时,都会为takeValue事件设置新的监听器。尝试使用以下代码片段或类似内容:

constructor() {
    this.socket = io('http://localhost:4000');
}

this.socket.on('ubalance',(data)=>{
    console.log(data);
    this.balance=data.data;
    });

this.socket.on('takeValue', (data) => {
    this.balance=data.balance;
    console.log("Value====="+data.value) + "\n";
    console.log("Balance======"+data.balance);

    });

ngOnInit() {
    this.socket.emit('getBalance',{msg:"bringBalance"});

}

getSum(event) {
    this.socket.open();
    this.socket.emit('giveValue',{msg:"New Value"});

}

谢谢,我找到了解决这个问题的方法,我只是在 ngOnInit 中声明了那些函数。现在它可以正常工作了。再次感谢 Milad Aghamohammadi。 - Jor Khachatryan

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接