SocketIO émet des fonctions de journalisation mais ne fonctionne pas correctement

Question

J'essaie de créer une application de chat basique avec socketIO, express, mongoDB, tout fonctionne bien.

La fonctionnalité que je souhaite est la suivante : le message le plus récent est ajouté et la section de message défile vers le bas.

Le message joint a ce format :

 $("#textdiv").append(` <li class='blueText'> <img src="//unsplash.it/50/50"/> ${message.name} </li>  <p class='blueText'> ${message.message} </p> <span class='blueText'>Posted on: ${message.time.slice(0, 10) } <span class='spacial'> at: ${message.time.slice(11, 19) }</span> </span>`);

L'horodatage fonctionnait bien, et sans autre modification directe de la ligne de code ci-dessus, il a cessé de fonctionner, ou ne fonctionne qu'après un rafraîchissement de la page. La console enregistre "message saved", mais dans la console du client, j'obtiens Uncaught TypeError : Cannot read property 'slice' of undefined. Mais ce n'est qu'un des problèmes, pas le principal.

Mon objectif est d'afficher un message à chaque fois qu'un utilisateur rejoint ou quitte la salle de discussion.

Ce que j'ai, c'est juste un fichier server.js et un fichier index.html.

Voici l'IO JS pertinent du fichier server.js :

io.on('connection', (socket) =>{
console.log('a user is connected', socket.id); // works
socket.emit('newEntry', { userID: socket.id, // works and is displayed on the front end and console
 description: 'Has joined the chat room!'
});
setTimeout(function() {  // works
socket.emit('testerEvent', { description: 'A custom event named 
testerEvent!'});
}, 4000);

socket.on('clientEvent', function(data) {  // works
  console.log(data);
// here the troubles start
socket.on('disconnect', function(){
console.log('user disconnected', socket.id); // this works 
socket.emit('leaving', { userID: socket.id, // this does not work, is logged on sevrer console, but nothing on client, no error
  description: 'Has left the chat room!'
});
});
})
});

Le code correspondant dans index.html est :

 var socket = io(); // init

 socket.emit('clientEvent', 'Sent an event from the client!'); // works
  $(() => { // works
      $("#send").click(()=>{
          sendMessage({name: $("#name").val(), message: 
  $("#message").val()});
      })
      getMessages();

  })
  socket.on('message', addMessages)
  socket.on('testerEvent', function(data){ // works
  console.log(data);

  $("#textdiv").append(` <li class='blueText'> ${data.description} </li> `);
    });
    // this does  not work, its looged on the server side console but nothing happens on client
    socket.on('leaving', function(data){
    console.log(data);

   $("#textdiv").append(` <li class='greenText'> User ${data.userID}  
   ${data.description} </li> `);
      });
    //the following does work, it should append the text to the last message but I can sort that out later.
      socket.on('newEntry', function(data){
      console.log(data);

     $("#textdiv").append(` <li class='blueText'> User ${data.userID}  
     ${data.description} </li> `);
        });

Pourquoi le message de départ ne fonctionne-t-il pas ? Il semble que tout ce que je fais dans la partie socket.on('disconnect', function(){ ne fonctionne pas.

Et comme j'obtiens cette erreur mentionnée précédemment lorsque j'essaie d'utiliser slice lorsque je récupère l'horodatage du modèle suivant, comment puis-je changer cela ? Je veux juste que le chat affiche "posté le [date] à [heure]".

Dans server,js, le modèle est défini :

var Message = mongoose.model('Message',{
name : String,
message : String,
time : { type : Date, default: Date.now }
 })

Et une dernière chose, comment puis-je effacer la console, chaque fois que je redémarre le navigateur sur localhost 3000, tous les anciens messages sont affichés et réaffichés, même dans les nouveaux onglets, comment puis-je arrêter cela, il est très fastidieux d'attendre que tous les messages précédents soient chargés, surtout avec un code sujet aux erreurs comme le mien (pardonnez-moi, je suis nouveau dans les choses côté serveur, mais j'adore ça :-)).

Le repo github : https://github.com/dampopgit/nodejsChat

le code est plus petit qu'il n'y paraît, toute l'aide est appréciée.

Localhost3000 et point d'entrée nodemon ./server.js

Je sais que c'est une question et demie, mais je veux surtout savoir ce que je fais mal dans la partie socket.on('disconnect', function(){} de server.js.

La prochaine chose serait comment assigner l'ID généré à un nom d'utilisateur, de sorte qu'il dise que l'utilisateur [nom d'utilisateur] a rejoint/quitté le chat. Mais chaque chose en son temps. Merci d'avoir jeté un coup d'oeil.

Je remarque également que tous les messages de chat, à l'exception du dernier, ont le même horodatage, ce qui est mauvais. Pourquoi cela se produit-il ? Il semble que l'horodatage complet ne devrait peut-être pas être généré à partir du modèle MongoDB, n'est-ce pas ?

Answer 1

Je l'ai résolu seul, les problèmes étaient nombreux.

var Message = mongoose.model('Message',{
name : String,
message : String,
time : { type : Date, default: Date.now }
})

Au lieu d'enregistrer la date dans MongoDB et de ne pas obtenir un horodatage correct, et d'obtenir des valeurs non définies si j'utilisais une méthode de chaîne, j'ai simplement fait ceci

var fullDate = new Date($.now()).toString();
var datePartialTime = fullDate.slice(16, 25);
var datePartialDate = fullDate.slice(0, 16);

Et voici le bon code pour obtenir un message et une popup quand un utilisateur quitte le chat

socket.on('disconnect', function(){
console.log('user disconnected', socket.id);
if (socket.username == undefined) {
  io.sockets.emit('leaving', { userID: "who values privacy",
    description: 'Has left the chat room!'
});
}

else{
  io.sockets.emit('leaving', { userID: socket.username,
  description: 'Has left the chat room!'

}) ;

io.sockets.emit au lieu de socket.on (le code frontal était correct, mais il était difficile d'obtenir cette information, en raison de la mauvaise documentation et des nombreux changements de version, il suffit de s'habituer à inspecter l'objet socket dans la console. C'est toujours un très bon framework, je ne suis pas sûr que les websockets natives soient meilleures maintenant.