Session Timeout keeps calling function in Angular 6

Question

I'm new to Angular, I'm using bn-ng-idle for session timeout, it is working fine however, when I put the code in ngOnInit or Constructor, the code keeps repeating over and over although I'm not even in the same page, so when I enter the employees page and then get routed to signin page the code inside the constructor keeps repeating for some reason, appreciate your help.

employee.component.ts

constructor(private bnIdle: BnNgIdleService, private router: Router){
this.bnIdle.startWatching(5).subscribe((isTimedOut: boolean) => {
    if (isTimedOut) {
      this.router.navigate(['/signin']);
      console.log('session expired');
    }
    return;
  });
}

Check the startWatching function. what happens when it finish (the 5 number refers to minutes?) does it reset itself to its initial value? because if it does it will just keep on running. The flow is: It doesnt matter which page your at. thats the point of observables. — dash
– dash, Commented Feb 2, 2020 at 8:37
oh I see, actually when it finishes it starts counting again, so I found a method that stops the counter which is stopTimer(), now the method gets called twice, which should still not happen — Omar
– Omar, Commented Feb 2, 2020 at 8:43
check my answer below, instead of the comment, I deatiled the answer for you. If you find it works for you please mark at as answer, if it doesnt please reply with whats not working and ill try to help you. — dash
– dash, Commented Feb 2, 2020 at 8:52

dash · Accepted Answer · 2020-02-02 08:50:50Z

1

Check the startWatching function. what happens when it finish (the 5 number refers to minutes?) does it reset itself to its initial value? because if it does it will just keep on running.

It doesnt matter which page youre at. thats one of the features of observables. When you register one it keeps on listening. Thats why you have to Unsubscribe (in ng-destroy) from them, or youll have a memory leak.

Im not so clear about what you want to achieve Is it to monitor the time past for the user since he is logged in? Better do it with tokens, and set the time on them.

If you still want to use the method your using you can add a condition that checks if the user is in the employee side:

for example:

isInEmployee: boolean;

constructor(private bnIdle: BnNgIdleService, private router: Router){

}

ngOnInit() {
  this.isInEmployee = true;

this.bnIdle.startWatching(5).subscribe((isTimedOut: boolean) => {
    if (isTimedOut && isInEmployee) ) {
      this.router.navigate(['/signin']);
      console.log('session expired');
    }
    return;
  });
}


ngOnDestroy() {
this.isInEmployee = false; -> with your method

//but its better to unsubscribe from 'startWatching'

}

But I would recommend using JWT for any session activities with sessionStroage

answered Feb 2, 2020 at 8:50

dash

3871 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Omar Over a year ago

I am using JWT and yes you clarified how this could be achieved already, and it's working great, thank you so much.

Nirav Patel · Accepted Answer · 2020-02-02 13:42:28Z

0

you need to store the subscription in subscription variable and when destroying component subscription need to be unsubscribe.

private sessionSubscription: Subscription;
ngOnInit(): void{
    this.sessionSubscription = this.bnIdle.startWatching(5).subscribe((isTimedOut: boolean) => {
        if (isTimedOut) {
        this.router.navigate(['/signin']);
        console.log('session expired');
        }
        return;
    });
 }

ngOnDestroy(): void {
    if (this.sessionSubscription){
      this.sessionSubscription.unsubscribe();
    }
 }

answered Feb 2, 2020 at 13:42

Nirav Patel

161 silver badge3 bronze badges

Collectives™ on Stack Overflow

Session Timeout keeps calling function in Angular 6

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related