Question

我正在使用一个离子应用程序中的socket.io为我们的应用程序构建一个小主题/聊天。我的问题是，每次我创建一个新主题时，我最终会在主题中再添一条消息，屏幕截图会更好地解释它：My list of topics

First time I create a topic after launching my app

我不需要实际提交新主题，只需按下添加主题页面（或离开它？）就会触发“新事件”？导致添加新消息。

这是我的添加主题页面（相关部分）：

  constructor(public navCtrl: NavController,
          public navParams: NavParams,
          public chatService: ChatService,
          private socket: Socket,
          public events: Events) {

            this.socket.on('add-message', (data) => {
              console.log("recu la reponse = " + JSON.stringify(data));
              this.chatService.sendMsg(data);
            });

            this.chatService.getUserInfo()
            .then((res) => {
                this.user = res
            });
}

this.chatService.sendSalon(newSalon, newMsg)
.then(() => {
  console.log("Message envoyé et contenu : " + newSalon);
  this.navCtrl.setRoot(ChatListPage);
})

这是服务器代码：

io.on('connection', (socket) => {

console.log("socket-chat-connection");

//Receive a salon
socket.on('add-salon', (envoi) => {
salon = envoi.salon;
message = envoi.message;
salon._id = new ObjectID();

db.collection("chatSalons", function(err, collection) {
  collection.save(salon, function(err, result) {
    if(err) {
      console.log('parse : err2 ' + err);
    }
    message.chatId = new ObjectID(salon._id);
    console.log("message.chatId = " + JSON.stringify(message));
    socket.emit('add-message', message);
  });
});
io.emit('salon-received', {text: salon.title, from: salon.userId, created: new Date()});
});
//Receive a message
socket.on('add-message', (message) => {
  message._id = new ObjectID();

  console.log("debut message = " + JSON.stringify(message));

  db.collection("chatMsgs", function(err, collection) {
      collection.save(message,  function(err, result) {
          if (err) {console.log('parse :err1'+err);}
      });
  });
  io.emit('message-received', {text: message.message, from: message.userId, created: new Date()});

});


});

以下是处理发送到服务器的聊天服务行：

mockNewSalon(salon, message) {
  setTimeout(() => {
      console.log(salon);
      console.log("contenu message avant envoi vers le serveur = " + JSON.stringify(message));
      this.socket.emit('add-salon', {salon, message});
  }, Math.random() * 50);
}

mockNewMsg(msg) {

  setTimeout(() => {
      console.log(msg)
      this.socket.emit('add-message', msg);
      //this.events.publish('chat:received', mockMsg, Date.now())
  }, Math.random() * 50)
}

  sendSalon(salon: ChatSalon, message: ChatMessage) {
  console.log("chat service sendSalon = " + salon);
  return new Promise(resolve => setTimeout(() => resolve(salon), Math.random() * 1000))
  .then(() => this.mockNewSalon(salon, message));
}

sendMsg(msg: ChatMessage) {
  return new Promise(resolve => setTimeout(() => resolve(msg), Math.random() * 1000))
  .then(() => this.mockNewMsg(msg));
}

很抱歉这个奇怪的代码演示文稿。所以，首先我发送主题（沙龙），当服务器完成将其保存到数据库时，它会发回带有这个新主题的id的消息，然后客户端发送消息，如果他实际上是在主题，这是使用它的正常方式。此外，在我遇到两个用户的问题之前（我的浏览器中有一个用户，一个在我的iPhone上）：如果我在浏览器中创建了一个主题，然后在我的iPhone上创建了一个主题，那么iPhone将发送两个第一条消息。我通过改变

来解决这个问题

io.emit('add-message', message);

通过

socket.emit('add-message', message);

Answer 1

我认为我找到了问题并修复了它，我只是不确定这是正确的方法但是会这样做。事实上，每次启动一个新页面时都会进入add-topic页面，这样就会有一个新的socket.on监听器。我以为我可以通过返回离子函数this.navCtrl.pop();来“删除”页面，但问题仍然存在。

所以我用socket.removeListener('add-message');删除了监听器我不确定每次推送到这个页面时都留下一个带套接字的新页面会有多糟糕，但优化会在以后进行。

套接字似乎复制了发射

1 个答案: