会话超时注销 :: 由 setTimeout 调用时出现 RouterExtensions 错误

Question

我正在尝试在空闲一段时间后实现会话超时。

当用户登录时，我将启动一个计时器，该计时器将在一段时间后将用户注销并将其路由回登录表单。

如果有事件（点击）我想清除计时器（这里是 5 秒）并启动一个新计时器，从而保持用户登录。

这是 login.component.ts 中的 setTimout 调用：

var timeoutId=setTimeout(this.funcService.logout, 5000);
ApplicationSettings.setNumber("timeoutId", timeoutId);

这里是具有注销功能的func.service.ts。

import {Injectable} from '@angular/core';
import {RouterExtensions} from "nativescript-angular/router";
import * as ApplicationSettings from "@nativescript/core/application-settings";

@Injectable({   providedIn: 'root' })
export class FuncService {
    
  constructor(
    private routerExtensions: RouterExtensions
  ) {
  }

  logout(): void {

    ApplicationSettings.setBoolean("authenticated", false);
    ApplicationSettings.remove("token");

    this.routerExtensions.navigate(["./login"], {clearHistory: true});
  }  
}

app.component.html

<page-router-outlet actionBarVisibility="never" (tap)=onEvent()></page-router-outlet>

app.component.ts

 onEvent() {
    var timeoutId=ApplicationSettings.getNumber("timeoutId");

    ApplicationSettings.remove("timeoutId");

    clearTimeout(timeoutId);

    var timeoutId=setTimeout(this.funcService.logout, 5000);
    ApplicationSettings.setNumber("timeoutId", timeoutId);
  }

当计时器耗尽并调用this.funcService.logout 时，我收到错误：

JS: ### ErrorHandler Error: TypeError: Cannot read property 'routerExtensions' of undefined
JS: ### ErrorHandler Stack: TypeError: Cannot read property 'routerExtensions' of undefined
JS:     at webpackHotUpdate../shared/func.service.ts.FuncService.logout (file:///app\shared\func.service.ts:35:9)
JS:     at ZoneDelegate.push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.ZoneDelegate.invokeTask (file:///node_modules\@nativescript\angular\zone-js\dist\zone-nativescript.js:421:0)
JS:     at Object.onInvokeTask (file:///node_modules\@angular\core\fesm5\core.js:24328:0)
JS:     at ZoneDelegate.push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.ZoneDelegate.invokeTask (file:///node_modules\@nativescript\angular\zone-js\dist\zone-nativescript.js:420:0)
JS:     at Zone.push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.Zone.runTask (file:///node_modules\@nativescript\angular\zone-js\dist\zone-nativescript.js:188:0)
JS:     at push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.ZoneTask.invokeTask (file:///data/...

如果我明确地调用this.funcService.logout，我不会收到任何错误。

知道这里发生了什么以便我可以绕过它吗？

这是实现这个的好方法吗？

TIA

注意：我也试过用路由器

this.router.navigate(["./login"], {
  relativeTo: this.activatedRoute
});

得到

S: ### ErrorHandler Error: TypeError: Cannot read property 'router' of undefined
JS: ### ErrorHandler Stack: TypeError: Cannot read property 'router' of undefined
JS:     at module.exports.push../shared/func.service.ts.FuncService.logout (file:///app\shared\func.service.ts:38:9)
JS:     at ZoneDelegate.push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.ZoneDelegate.invokeTask (file:///node_modules\@nativescript\angular\zone-js\dist\zone-nativescript.js:421:0)
JS:     at Object.onInvokeTask (file:///node_modules\@angular\core\fesm5\core.js:24328:0)
JS:     at ZoneDelegate.push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.ZoneDelegate.invokeTask (file:///node_modules\@nativescript\angular\zone-js\dist\zone-nativescript.js:420:0)
JS:     at Zone.push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.Zone.runTask (file:///node_modules\@nativescript\angular\zone-js\dist\zone-nativescript.js:188:0)
JS:     at push.../node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js.ZoneTask.invokeTask (file:///data/data/com.FileExpenses.app/files/app/v...

更新

成功了

var timeoutId=setTimeout(() => {

  ApplicationSettings.setBoolean("authenticated", false);
  ApplicationSettings.remove("token");

  this.routerExtensions.navigate(["./login"], {clearHistory: true});
}, 5000);

谢谢@Yong

Answer 1

修复未定义的路由器扩展

var timeoutId=setTimeout(() => this.funcService.logout, 5000);