Timeout trigger when user working in multiple tabs of browser.

[H45nain]

There is an issue if application is opened in multiple tabs.
If User open application in two tabs of chrome, User working in tab 1 and tab 2 is idle for required time. Application triggers timeout even User is working on tab 1 of chrome.
In our scenario, we are forcefully logout the user. In this case user gets logout from application because other tab is idle.

How to handle the scenario in package.

[yosvield]

Did you find how to solve this problem?

[denny99]

I'm using the document visibilitychange event. When leaving the tab, i stop the watcher, when entering i'm starting it again.

I've also utilized the local storage, which is shared between all tabs and the window storage event which is fire when the storage changes. So im able to communicate the timeout to all tabs and open an info dialog.

[biznisprofil]

@denny99 Good idea. What about if we want to logout user if he is on another website? He is not active on our website, so I would like to log him out, just in case he decide to leave, some sensitive data will be available.

[sw-tt-bansariakhani]

@denny99 can you please share your solution code ?

[denny99]

I cannot post you the full code but in the core its something like that:

    window.addEventListener('storage', (e) => {
      if (e.newValue) {
        // call all events
      }
    });
    public on(event: string, fn: MultiTabEventFunction): void {
    this.events[event].push(fn);
  }
    public fire(event: string, payload: any): void {
    // set own id into data object, we don't wanna listen to our own change
    localStorage.setItem(event, JSON.stringify({
      tabId: MultiTabSynchronizerService.TAB_ID,
      payload,
      event
    }));
  }

And when one timeout occurs i fire the event to the other tabs