Question

我正在开发单页面应用程序，此应用程序是分析的实时可视化。

使用的技术/编程语言：

AngularJs
Node.js 
socket.io

我在应用程序中有以下route：

/ activePage
/ referrerPage
/ devicePage

我在使用socket.io做什么？

当我路由到/activePage时，我从客户端触发 activePage 事件。服务器正在侦听特定事件，它将获取与该事件相关的一些数据，通过以某个时间间隔发出一些事件将数据发送到客户端。
当我换到另一条路线时，假设/devicePage。它将与上面的内容一样，使用不同的事件名称。
问题：客户端获取两个不同的数据，一个用于activePage和devicePage。我只期望一个数据属于最后一条路线devicePage。

服务器端代码：

    socket.on("activePage", function (data) {
        setInterval(function () {
            realTime.getActivePageData(data, function (result) {
                socket.volatile.emit("active", result);
            });
        }, 3000);
    });

    socket.on("devicePage", function (data) {
        setInterval(function () {
            realTime.getDeviceData(data, function (result) {
                socket.volatile.emit("device", result);
            });
        }, 3000);
    });

客户端代码：

    SocketService.on("active", function (data) {
      console.log("active", data);
    });

    SocketService.on("device", function (data) {
     console.log("device", data);
    });

注意：此应用程序适用于多个用户。

我该如何解决这个问题？

任何建议都将不胜感激。

Answer 1

好像你在＆＃34; activePage＆＃34;上开始了间隔。事件，反复发送“活跃”的事件。数据。由于您没有将此间隔保存到变量中，因此我认为它不会在代码中的任何其他位置清除。

当你在一个新事件上开始一个新的事件时，一个解决方案是清除前一个间隔，如下所示：

var activePageInterval; //this variable will hold the interval
socket.on("activePage", function (data) {
    activePageInterval = setInterval(function () {
        realTime.getActivePageData(data, function (result) {
            socket.volatile.emit("active", result);
        });
    }, 3000);
});

socket.on("devicePage", function (data) {
    clearInterval(activePageInterval); //clearing the interval to stop sending 'active' data
    setInterval(function () {
        realTime.getDeviceData(data, function (result) {
            socket.volatile.emit("device", result);
        });
    }, 3000);
});

（反之亦然 - 您也可以使用具有更通用名称的相同变量，因为我假设您从不希望定期播放超过1种类型的数据，只适用于当前页面的数据）

如何在单页面应用程序中处理socket.io事件？

使用的技术/编程语言：

1 个答案: