Socket.io не понимает имена пользователей

Question

Я пытаюсь добавить чат в мое веб-приложение на YouTube.Когда вы входите в приложение, появляется предупреждение, которое требует от вас имени пользователя, чтобы сообщить людям, кто вы.Допустим, мое имя1.Когда я пишу что-то в чате, оно выглядит как имя1: бла бла.

Но когда другой человек присоединяется к чату, скажем, имя2.Я вижу его / ее сообщения как name1, а он / она видит мои сообщения как name2.

Я пытался сообщить socket.io различия между ними, но, по-видимому, мне не удалось ..

Этоthe app.js:

// Socket setup
io.on('connection', function(socket) { 

  // username
  socket.on('new user', function(username) {
    socket.username = username;
    io.emit('new user', username);
    console.log(username + ' connected');
    io.emit('connection2', "Welcome to Ömür's Chatbox " + username);  
    socket.on('disconnect', function() {
      console.log(username + ' disconnected');
    });
  });

  // chatbox
  socket.on('chat message', function(msg){
    console.log('message: ' + msg);
    io.emit('chat message', msg);
  });

  // User connections
  console.log('User ' + socket.id + ' Connected');
  socket.on('disconnect', function() {
    console.log('User ' + socket.id + ' Disconnected');
  });  
});

Это скрипт в главном ejs:

var socket = io();
var username = prompt("What's your username?");

socket.emit('new user', username);

$('form').submit(function() {
  socket.emit('chat message', $('#m').val());
  $('#m').val('');
  return false;
});

socket.on('chat message', function(msg) {     
  var li = $("<li></li>");
  var span = $("<span></span>").css('color', getUsernameColor(username));
  span.addClass("userNameSpan");

  $('#messages').append($(li).text(msg));
  $(li).prepend($(span).text(username));       
});

socket.on('connection2', function(msg) {
  $('#messages').append($('<li style="font-style:italic;">').text(msg));
});  

Полный код можно посмотреть с здесь

Answer 1

В настоящее время другой узел не знает имени пользователя отправителя.

Включите его в сообщение следующим образом:

$('form').submit(function() {
  let message = {
    username: username,
    payload: $('#m').val()
  }
  socket.emit('chat message', message);
  return false;
});

socket.on('chat message', function(message) {
  let {payload, username} = message;
  var li = $("<li></li>");
  var span = $("<span></span>").css('color', getUsernameColor(username));
  span.addClass("userNameSpan");

  $('#messages').append($(li).text(payload));
  $(li).prepend($(span).text(username));
}