Socket.io 在浏览器刷新后发出重复数据

Question

我有一个带有按钮的页面。单击按钮时，它通过 socket.io 获取数据。但是，每次我重新加载页面时，socket.io 都会从前一个数据集中发回一份额外的数据副本。所以我的数据在第一次加载页面时看起来不错（例如：abcd）。然后重新加载页面会得到2n个数据（abcdabcd），再次重新加载页面我得到3n个数据（abcdabcdabcd）等等。

如何避免在页面重新加载时将重复数据发送回客户端？这是我的代码。

服务器端：

app.get('/test', function(req, res){

        // some code...

    io.sockets.on("connection", function(socket){

        var socketFn = function(data){
            socket.emit("trends", {
                trends: JSON.parse(redisData)
            });
        };

        socket.on("action", socketFn);

        socket.on("disconnect", function(){
            socket.removeListener("action", socketFn); // this doesn't work
        });

    });
    res.render('test');

});

客户端：

    var socketOpts = {
    "sync disconnect on unload" : true
};
var socket = io.connect("", socketOpts);

socket.on("trends", function(data){
    // data received from the node server, so do something with it
});


function action(){
    socket.emit("action", {phrase: "some dummy data"});
    return false;
}

// already checked client side doesn't fire multiple click event
$("button#click").off("click").on("click", action); 

Answer 1

那是因为你听连接的次数与客户端点击页面的次数一样多。

app.get('/test', function(req, res){
//when client opens the page 

    io.sockets.on("connection", function(socket){
    //start listening to new connection
    ...

从你的路由中初始化连接事件监听器被认为是一个坏主意。它应该只在全球范围内执行一次。在这里，每次您的客户端访问该页面时，它都会在访问该页面的次数中监听事件。