Функция выездной комнаты SocketIO не работает

Question

Я разрабатываю несколько комнат чата с SocketIO.И кажется, что функция Join to the Room работает хорошо, но выход из комнаты не работает.

Я проверил с тремя разными идентификаторами и протестировал функцию присоединения и выхода

Каждая ссылка на Room имеет значение idкак <a href="#" onclick="joinChat()"><h5 id="Apple-cliffordfajardo">sangumee</h5></a>

[код на стороне клиента]

var socket = io.connect('IPADDRESS');
let current;

function joinChat() {
    let joinedRoomName = window.event.target.id; // Get clicked id (ROOM NAME)

    $('.msg_history').empty(); // to Remove Previous Chats
    socket.emit('JoinRoom', {
        joinedRoomName,
        leave: current,
    });
    current = joinedRoomName;
    console.log(`CURRENT ROOM : ${current}`);
    console.log(`NewJoined ROOM ${joinedRoomName}`)

    $('#chat').submit(function () {
        //submit only if it's not empty
        if ($('#message').val() != "") {
            var msg = $('#message').val();
            socket.emit('say', {
                msg: msg,
                userId: userId,
                loginedId: loginedId,
                joinedRoomName: joinedRoomName
            });
            //say event means someone transmitted chat
            $('#message').val('');
        }
        return false;
    });
}

$(function () {
    socket.on('mySaying', function (data) {
        if (data.userId != userId) {
            $('.msg_history').append(`<div class="incoming_msg"><div class="incoming_msg_img"><img src="https://ptetutorials.com/images/user-profile.png" alt="sunil"></div><div class="received_msg"><div class="received_withd_msg"><p>${data.msg}</p><span class="time_date"> 11:01 AM    |    June 9</span></div></div></div>`);
        } else {

            $('.msg_history').append(`<div class="outgoing_msg"><div class="sent_msg"><p>${data.msg}</p><span class="time_date"> 11:01 AM    |    June 9</span></div></div>`);
        }
    });

[код на стороне сервера]

// Socket IO 
io.on('connection', function (socket) {
  // Join Room
  socket.on('JoinRoom', function (data) {
    socket.leave(`${data.leave}`);
    console.log(`Leave ROOM : ${data.leave}`)
    socket.join(`${data.joinedRoomName}`);
    console.log(`NEW JOIN IN ${data.joinedRoomName}`)
  })

  // Send Message
  socket.on('say', function (data) {
    console.log(`${data.userId} : ${data.msg}`);
    //chat message to the others
    //mySaying to the speaker
    io.sockets.to(`${data.joinedRoomName}`).emit('mySaying', data);
    console.log(`Message Send to : ${data.joinedRoomName}`)
    // console.log(`Message Content : ${data.userId} : ${data.message}`);
    db.query(`INSERT INTO chatData (roomName, chatSender, chatMessage) VALUES (?,?,?)`, [data.joinedRoomName, data.userId, data.msg])
  });
})

Пользователь 1 Общайтесь в 'ROOM 1' -> Работает!Пользователь 2 Общайтесь с 'ROOM 1' -> Работает!Так что пользователь 1 и пользователь 2 общаются друг с другом.

Но если пользователь 2 перейдет в «НОМЕР 2», «НОМЕР 1» должен быть оставлен, но кажется, что пользователь 2 все еще соединяется с «НОМЕР 1».Так что пользователь 2 общается в чём-то и отправляется в НОМЕР 1

Однако, действительно странно, что если пользователь 1 отправляет сообщение, то на странице чата пользователя 2 не может быть получено ни одно сообщение.Но если Пользователь 3 отправляет сообщение Пользователю 2, получает сообщение, но не может отправить Пользователю 3.

Я думаю, что это проблема логики чата

Answer 1

На самом деле, это действительно простая проблема.Я просто установил переменную joinRoomName снаружи и переместил функцию отправки.

var socket = io.connect('IPADDRESS');
let joinedRoomName, current, others;

/* Click Each Room list Function */
function joinChat() {
    joinedRoomName = window.event.target.id; // Get clicked id (ROOM NAME)
    others = document.getElementById(joinedRoomName).innerHTML; // Talk with this person
    $('.msg_history').empty(); // to Remove Previous Chats
    socket.emit('JoinRoom', {
        joinedRoomName,
        leave: current,
    });
    current = joinedRoomName;
    console.log(`CURRENT ROOM : ${current}`);
    console.log(`NewJoined ROOM ${joinedRoomName}`)
}