重新连接后，Socket IO 未接收到发出数据

Question

我可以知道客户端断开连接并重新连接后导致聊天消息不再显示在客户端浏览器上的代码的哪一部分，但是聊天仍然发送到服务器，其他用户将能够看到该消息，只是原始消息发送者本身将无法接收消息。我想知道这是套接字问题还是javascript问题？

提前致谢，抱歉我的英语不好:)

Socket IO 版本 1.3.7

注意：我正在将聊天与laravel集成，所以不会在这里使用任何nodejs路由，我想它不会对我造成任何问题，因为聊天能够正常运行......只是我目前面临的上面的问题

//server.js
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

io.on('connection', function(socket){
    //console.log('a user connected: ' + socket.id);
    socket.on('disconnect', function(){
        console.log( socket.name + ' has disconnected from the chat.' + socket.id);
        io.emit('user', io.sockets.sockets.length);
        io.emit('chat message', socket.name + ' has disconnected from the chat.');
    });
    socket.on('join', function (name) {
        socket.name = name;
        console.log(socket.name + ' joined the chat.'+ socket.id);
        io.emit('user', io.sockets.sockets.length);
        io.emit('chat message', socket.name + ' joined the chat.');
    });
    socket.on('chat message', function(msg){
        io.emit('chat message', msg);
        console.log(msg);
    });
});

http.listen(3000, function(){
    console.log('listening on *:3000');
});

''

//Client code here
<div class="board" style="position: absolute;right:40%;width:350px;height:500px;" id="liveQuickAskDesk">

        <h2 class="timberGradient">Live Quick Ask Desk</h2>
        <div id="innerQuickAskDesk">
            <span id="total_user"></span> staff online currently
            <button type="button" id="disconnect" class="btn btn-danger">Offline</button>
            <div class="col-lg-12" id="messagewindow" style="position: absolute;height:330px;overflow: auto;">
                <span id="messages"></span>
            </div>
            <div class="col-lg-12">
                <form style="position: absolute;margin:110% 0 0 0;width:320px;">
                    <div class="form-group">
                        <label>Message:</label>
                        <input type="text" class="form-control" id="m">
                    </div>
                </form>
            </div>
        </div>

        <div class="col-lg-12 center-block" id="connect_div">
            <button type="button" id="connect" class="btn btn-primary center-block" style="margin-top: 50%;">Online</button>
        </div>

    <script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
    <script src="http://code.jquery.com/jquery-1.11.1.js"></script>
    <script>

      $("#connect_div").hide();
      var socket = io.connect('http://localhost:3000');
      var name = "<?php echo $user_name ?>";

      $('#disconnect').click(function(){
          socket.disconnect();
          $("#liveQuickAskDesk").css('background', 'rgba(0,0,0,0.1)');
          $("#innerQuickAskDesk").hide();
          $("#connect_div").show();
          $('#messages').html("");
      });
      $('#connect').click(function(){
          socket = io.connect('http://localhost:3000',{'forceNew':true});
          socket.on('connect', function(msg){
              socket.emit('join', name);
              console.log("client reconnect to the server");
          });
          $("#liveQuickAskDesk").css('background', 'rgba(0,0,0,0)');
          $("#connect_div").hide();
          $("#innerQuickAskDesk").show();

      });

      socket.on('connect', function(msg){
          socket.emit('join', name);
          console.log("client join the server");
      });
      socket.on("disconnect", function(){
          console.log("client disconnected from server");
      });

      $('form').submit(function(){
      $('#messagewindow').animate({ scrollTop:$('#messagewindow').prop('scrollHeight')}, 10);
        socket.emit('chat message', "Staff "+name+": "+$('#m').val());
        $('#m').val('');
        return false;
      });

      socket.on('user', function(msg){
        $('#total_user').html(msg);
      });
      socket.on('chat message', function(msg){
        $('#messages').append($('<p>').text(msg));
      });

    </script>

</div>

Answer 1

断开连接并重新连接时，您会丢失侦听器，因此将侦听器保留在函数内并在每次连接时调用它应该没问题。

socket = io.connect('http://localhost:3000',{'forceNew':true});
setevts();

 function setevts () {

   socket.on('connect', function(msg){
      socket.emit('join', name);
      console.log("client join the server");
  });

  socket.on("disconnect", function(){
      console.log("client disconnected from server");
  });

   socket.on('user', function(msg){
    $('#total_user').html(msg);
  });

  socket.on('chat message', function(msg){
    $('#messages').append($('<p>').text(msg));
  });

}

Answer 2

我在服务器端使用以下代码来解决同样的问题

let socketServer = new socketIOServer(server, {
  cors: {
    origin: "*",
  },
});

socketServer.on("connection", (socket) => {
  socketServer.to(socket.id).emit("event", "msg");
});