Router does not see isAuth state changes, how to track?

Question

Google Chrome

Router code

router.beforeEach((to, from, next) => {
  const requireAuth = to.meta.auth

  if (requireAuth && store.getters['auth/isAuthenticated']) {
    next()
  } else if (requireAuth && !store.getters['auth/isAuthenticated']) {
    next({name: 'login'})
  } else if (!requireAuth && store.getters['auth/isAuthenticated']) {
    next({name: 'admin'})
  } else {
    next()
  }
})

Status code

state() {
    return {
      isAuth: false,
      user: null,
      emailFormFactor: ''
    }
  },
 getters: {
    isAuthenticated(state) {
      return state.isAuth
    },
    getEmailFormFactor(state) {
      return state.emailFormFactor
    },
    getUser(state) {
      return state.user
    }
  }

Main App.vue Code

onBeforeMount(
      () => {
        if (localStorage.getItem('auth-token')) {
          store.dispatch('auth/checkAuth')
        }
      }
    )

I can't track the change when refreshing the token.
It is not an option to immediately receive an element from local storage in isAuth, because the check for the validity of the token is performed first.

Answer 1

does not exist
in this extension, depending on sites, it's simple, the
proxy is just part of the request header,
and once every half an hour, all tabs will have to be changed with unpredictable consequences

Answer 2

My solution at the moment is to re-request the server in router.beforeEach, if 401 status falls, then it immediately makes a re-call, and either loads already as authorized. Or as unauthorized.