javascript - 5 分钟后空闲用户注销是否无法在 Angular-7 的所有页面上正常工作？

Question

我正在尝试在 不活动 5 分钟后自动用户注销 没有任何依赖项 或使用 javascript 的模块但它在我的 Angular 的第一页上工作正常，但在其他路由器上不起作用，在其他路由器上它一直显示警报框，即使在 单击确定 之后.此外，如果我将一页(路由器)切换到另一页，它仍然会计算最后一页的倒计时，而不是重置它并计算新页面。

这是我的代码-

  var IDLE_TIMEOUT = 10; //seconds
    var _idleSecondsCounter = 0;
    
    document.onclick = function () {
        _idleSecondsCounter = 0;
    };
    
    document.onmousemove = function () {
        _idleSecondsCounter = 0;
    };
    
    document.onkeypress = function () {
        _idleSecondsCounter = 0;
    };
    
    window.setInterval(CheckIdleTime, 5000);
    
    function CheckIdleTime() {
        _idleSecondsCounter++;
        var oPanel = document.getElementById("SecondsUntilExpire");
        if (oPanel)
            oPanel.innerHTML = (IDLE_TIMEOUT - _idleSecondsCounter) + "";
        if (_idleSecondsCounter >= IDLE_TIMEOUT) {
            alert("Time expired! Please Login Again");
            localStorage.clear();
            window.location.replace(location.origin);
        }
    } 

如果我在其他页面上也写上面的代码，即使点击它仍然显示，我现在应该尝试什么？

Answer 1

您需要确定放置此特定逻辑的正确位置。

1.) View 的逻辑:仅适用于特定 View 的逻辑应保留在同一组件中。

2.) 重用逻辑:根据您的问题陈述，您应该为这个特定场景形成一个服务。通过将此服务注入(inject)每个 View 的 .ts 文件，将此逻辑添加到该服务并在每个 View 上重用它。

选择第二个选项(重用逻辑)，这可能会按预期工作。