Ionic 3 redirect after user In-active in app for some time?

How to we detect user is in-active in ionic application so we can redirect him/her in login page again.

According to Wesley answer

// idle logout timer set to 10 second
public idleLogoutTimer: number = 10000;

// First execute the timer and wait for hostListener 
onInit() {
  this.restartIdleLogoutTimer();
}   

// Whenever users touch action occure this function will execute.
@HostListener('touchstart')
onTouchStart() {
  this.restartIdleLogoutTimer();
}

// First this will clear timeout then again setTimeout fun and counting start again, After specific time if user did not active then log out function will execute.

restartIdleLogoutTimer() {
 clearTimeout(this.idleLogoutTimer);
   this.idleLogoutTimer = setTimeout(()=>{
   this.logoutUser();
 },60000);
}

logoutUser() {
  // your logout logic here
}

1 answer

  • answered 2020-10-16 06:21 Wesley

    When your app initializes, set a timeout for whatever amount of time you want to consider someone "idle". Then listen to "touchstart" event and trigger the timeout to restart every time the user touches the screen.

    In app.component.ts

    @HostListener('touchstart')
    onTouchStart() {
        this.restartIdleLogoutTimer();
    }
    
    idleLogoutTimer;
    
    OnInit() {
      restartIdleLogoutTimer();
    }
    
    restartIdleLogoutTimer() {
      clearTimeout(this.idleLogoutTimer);
      this.idleLogoutTimer = setTimeout(()=>{
        this.logoutUser();
      },60000);
    }
    
    logoutUser() {
      // your logout logic here
    }