时间戳

首页 > 解决方案 > 刷新页面时Socket IO进行多个连接-Node JS

node.js - 刷新页面时Socket IO进行多个连接-Node JS

问题描述

我开发了一个报废工具，可以从所有网站报废工作并将它们保存到数据库中。我已经创建了自己的默认日志，我在其中获取消息（错误、信息）等。我正在使用 socket.io 来实时更新我的​​视图以及数据库。

问题是当我启动应用程序时，它完美地建立了套接字和数据库连接。但是当我尝试刷新页面时，相同的连接会再次使用相同的消息和不同的 ID 进行两次。我刷新页面的同时建立了连接，并且 ID 被更改，但是对于所有建立的连接，它们使用一个 ID，

下面是显示它的日志：

在此处输入图像描述

我已经上传了这个视频，请检查一下。尝试看最开始，然后在01:41and 03:06，在第一个站点开始报废之前建立连接，但是当第二个站点报废时，Internet Connection消息会发出两次，与第三个站点报废时相同，消息的数量每次都翻倍。我不知道为什么。

我试过按照这个问题的答案，但仍然没有成功。代码在server文件中有 600 多行，第二个文件有 150 多行，在客户端也是如此，这就是为什么我不能全部上传，而且有点保密。

但是客户端和服务端的socket连接是这样的：

服务器端 

const express              =    require("express");
const app                  =    express();
const scrap                =    require("./algorithm");
const event = scrap.defEvent;//imported from another file 
const ms_connect = scrap.ms_connect;
const server = app.listen(8000, function(){ console.log('Listening on 8000'); });
const io                   =    require("socket.io").listen(server);
const internetAvailable    =    require("internet-available");
app.use(express.static(__dirname + "/"));


app.get("/scrap",function(req,res){
    res.sendFile(__dirname+"/index.html");//Set the Default Route
    io.on("connection",function(socket){ //On Socket Connection
        socketSameMess("Socket",'Sockets Connection Made on ID : <span style="color:#03a9f4;">'+socket.id+'<span>');
        ms_connect.connect(function(err){//On Connection with Database
            if(err) socketSameMess("database_error",err+" "); // If any error in database connection
            socketSameMess("Database ",'Connected to MYSQL Database Successfully...');
        })
    })
})

function eventSameMess(auth,mess){
    //hits the custom console
    defEvent.emit("hitConsole",{a:auth,m:mess});
}

客户端

var socket = io.connect('http://localhost:8000');
socket.on('connect',function(){
    if(socket.connected){
        initDocument();
    }
})

标签： node.jswebsocketsocket.iosocket.io-1.0

解决方案

获取多条消息

这是socketio的一些经验法则

  1. 如果您收听任何事件一次，您将在回调中收到一次消息

  2. 如果您两次收听任何事件，您将在回调中收到两次消息

  3. 如果您第 n次收听任何事件，您将在回调中收到第n次消息

  4. 如果您正在收听页面加载时的任何事件，请在离开页面之前不要忘记listen off该事件（如果事件不是全局的）

    • 如果你忘记了listen off，如果你再次重新访问页面。您将开始多次收听事件。因为在页面加载时您正在收听该事件。并且之前的事件还没有停止listen off

  5. 不要收听 中的任何事件loop，它可能会多次收听，并且您将在一次更改时收到多条消息。

连接插座

const socket = io('http://localhost', {
  transports: ['websocket'], 
  upgrade: false
});

聆听并聆听事件

let onMessage = (data) => {
  console.log(data);
}
//listen message
socket.on('message', onMessage);

//stop listening message
socket.off('message', onMessage);

在断开连接时删除所有侦听器

socket.on('disconnect', () => {
   socket.removeAllListeners();
});

使用Firecamp 直观地测试/调试 SocketIO 事件。

推荐阅读