AngularJS Angular2 中的 $idleProvider 和 $keepaliveProvider

Question

在AngularJS 1.*中有两个非常有用的供应商，$idleProvider和$keepaliveProvider。我用它们来处理会话超时并自动注销以前项目中的用户。我们现在正在从 Angular2 小组开始一个新项目，我想知道是否有计划对这些项目提供类似的支持？理想情况下，我们可以有一个自动从客户端注销用户的机制。这是我们如何在 AngularJS 中完成此操作的源代码片段——如何使用 Angular2 完成此操作？

// Configure Idle Session Timeout 
userModule.config([
    'KeepaliveProvider', 'IdleProvider',
    ($keepaliveProvider, $idleProvider) => {
        var str = $('#IdleSessionTimeout').text();
        var idleTimeOut = parseInt(str);
        var interval = 60;
        if (isNaN(idleTimeOut)) {
            idleTimeOut = 20;
            interval = 10;
        } else {
            idleTimeOut *= 60; // Convert minutes -> seconds
        }
        $idleProvider.idle(idleTimeOut);
        // If we ever want to warn user they are about to timeout
        //$idleProvider.timeout(5); 

        $keepaliveProvider.interval(interval);
    }
]);

userModule.run(($rootScope) => {
    $rootScope.$on('IdleTimeout', () => {
        // On timeout, end the user session by redirecting to logout
        var url = window.location.href;
        url = url.replace(/\/\#.*$/, "/Account/Logout");

        window.location.href = url;
    });
});

// Activate Timeout Monitoring
userModule.run(['Idle', ($idle) => {
    $idle.watch();
}]);

请帮忙...

Answer 1

您可以创建一个单例服务，该服务将在特定时间后对 warn/logout 用户执行类似于示例代码的功能。比超时你可以改变 url 或破坏一些其他依赖等。

您还可以获得当前应用程序的 NgZone，并订阅 onTurnDone，如果它被调用，则可能是用户处于活动状态，因此您可以重置计时器（您不必在每个区域完成时重置它，而是每 3 分钟重置一次如果有动作）。这是我现在想到的唯一解决方案:)

示例：

import {Injectable} from "angular2/core";
@Injectable()
export class idleService {
    timeout:number;
    warnTime:number;
    timer:any;
    timestamp: any;
    consturctor(public _ngZone:NgZone) {
        _ngZone.onTurnDone
                .subscribe(() => {
                    if(new Date() - this.timestamp > 30000) // Do this every X minutes you will not "spam" clear -> init all the time
                    clearTimeout(this.timer);
                    this.init();
                });
    }
    init() {
        this.timestamp = new Date();
        this.initWatcher(()=> {
            alert("You will be logged out in" + this.warnTime);
            this.initWatcher(() => {
                this.LogoutFunction()
            }, this.warnTime)
        }, this.timeout);
    }
    initWatcher(action, timeout) {
        this.timer = setTimeout(() => {
            action() //warn/disconnect user}, timeout);
        }, timeout)
    }
}

onTurnDone 基本上类似于 Angular 中的 "on scope changes" 1，但我认为我们不应该滥用它。我试图实现这样的 scrollglue 指令，因为我找不到任何其他方式来监听范围内的变化

Answer 2

这实际上是我的误解，因为 AngularJS $idleProvider 和 $keepaliveProvider 实际上不是 Angular队。这是由 "Hacked By Chinese" 创建的，他编写（并维护）了针对 Angular2:

的两个端口

以前称为 $idleProvider：
- https://github.com/HackedByChinese/ng2-idle
以前称为 $keepaliveProvider：
- https://github.com/HackedByChinese/ng2-idle-keepalive

AngularJS Angular2 中的 $idleProvider 和 $keepaliveProvider

AngularJS $idleProvider and $keepaliveProvider in Angular2

redirect

session-timeout

angularjs

angular