javascript - 刷新后 Angular $超时

Question

我遇到了 Angular $timeout 问题。如果我不点击 F5/重新加载页面，它就可以正常工作。当我重新加载页面时，超时停止并且永远不会调用我在超时中提供的函数。我觉得代码很好，但我缺少一些东西。为什么刷新页面时永远不会超时？

export class AccountController
{

    constructor(private $scope: ControllerScope, private $location: ng.ILocationService, private AuthService: AuthService, private $timeout: ng.ITimeoutService)
    {

    }

    public Login(model: LoginModel)
    {
        this.AuthService.login(model).then((response: any) =>
        {
            //when token will expire -> logout
            this.$timeout(() =>
            {
                this.Logout();
            }, <number>response.TokenExpireTime).then((d) =>
            {
                alert('Czas trwania sesji wygasł');
            });

            this.$location.path('/');
        },
        (err) =>
        {
            alert(err.error_description);
        });

    }

    public Logout()
    {
            this.AuthService.logOut();
            this.$location.path("/login");
    }

}

Answer 1

好吧，假设您仅在用户单击登录按钮后调用LOGIN，这里是解释。

当您注册$timeout后，刷新浏览器后它将被删除。这是标准行为，也是浏览器环境中的工作方式。

也就是说 - 在新页面刷新时，当用户已经登录时，您不再调用 login 方法。这意味着您不会再次注册 $timeout ，刷新后，浏览器不知道您想要使用它。

一种解决方案可能是更改该代码以在每次页面加载时注册 $timeout 但进一步查看您的代码，您可以将 TokenExpireTime 设置为内部变量，例如 localStorage 并在其他地方使用它.

假设设置了 localStorage['expires'] 的示例。

if (localStorage['expires']) {
   $timeout(function() {
      // do your thing, if you are not going to update model, keep 3rd parameter false,
      // otherwise skip it to prevent $digest cycle from running
   }, localStorage['expires'], false);
}

这类似于银行 session ，无论您在做什么，都会在 15 分钟后将您注销。

如果您想在用户转到不同页面或只是与您的应用程序交互时重置超时，您需要通过添加例如焦点事件。

$(window).on('focusin', function() {
    // clear timeout, user is back in your app
});

$(window).on('focusout', function() {
   // register timeout, user is away
});