CODEWITHSUNDEEP
angularnativescriptangular2-nativescript
chakotha
chakotha

Reputation: 95

Session Timeout Logout :: RouterExtensions errors when called by setTimeout

I am trying to implement a session timeout when idle for a certain time period.

When the user logs in I'm starting a timer that will log the user out after a time interval and route them back to the login form.

If there is an event (tap) I want to clear the timer (5 seconds here) and start a new timer, thereby keeping the user logged in.

Here is the setTimout call in login.component.ts:

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

Here is func.service.ts that has the logout function.

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);
  }

When the timer runs down and this.funcService.logout is called I get the error:

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/...

If I call this.funcService.logoutexplicitly I get no error.

Any idea what is happening here so I can get around it?

Is this an OK way to implement this?

TIA

Note: I have also tried using the router

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

Getting

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...

UPDATE

This worked

var timeoutId=setTimeout(() => {

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

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

Thanks @Yong

Upvotes: 0

Views: 665

Answers (1)

Yong
Yong

Reputation: 1127

To fix undefined routerExtensions

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

Upvotes: 1

Related Questions