刷新页面时套接字 IO 进行多个连接 - Node JS

Question

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

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

以下是显示它的日志：

我已经上传了这个视频，请也检查一下。试着看一开始，然后 at01:41和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();
    }
})  

Answer 1

收到多条消息

这是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 事件。

Answer 2

我遇到的问题是每个客户端都有两个套接字连接。我以为套接字有问题。但问题是

• 前端 -> 反应
• 使用 create-react-app 创建模板
• 在index.js文件中它使用了名为React.StrictMode的东西
• 此模式会渲染某些 App.js 组件两次。
• 只需删除 React.StrictMode 并尝试查看您的问题是否得到解决。