We have a SPA for the medical field. Our requirements state that after 30 minutes of inactivity, the user must be logged out and their screen be cleared of all data (i.e. redirected to logout).
I know that I can set the inactivity timeout via Log In Session Management >> Inactivity timeout
In the client, I would like to periodically check if the session is still valid (inactivity timeout has not been reached). If the session has ended, then I would redirect them to the login screen.
What I cannot seem to figure out is how to check the session in such a way that will not extend it. Is there such an api?
You can use the getTokenSilently method to check on the session without extending it. If the token is valid, the token will be returned. If the user has a valid session that has not timed out, then a new token will be returned. Otherwise, a login_required error will be thrown.
To make sure this does not extend the session, I did a quick test in the Vue Quickstart by updating my tenant’s inactivity timeout to 3 minutes and the ID Token lifetime to 2 minutes and updated the app’s src/components/NavBar.vue file:
<script>
export default {
name: "NavBar",
methods: {
login() {
this.$auth.loginWithRedirect();
},
logout() {
this.$auth.logout();
this.$router.push({ path: "/" });
},
check() {
const logout = this.logout;
this.$auth.getTokenSilently().then((token) => {
console.log(token)
}).catch((e) => {
console.error({e});
if (e.error === 'login_required') {
logout();
}
});
}
},
mounted: function () {
// Check every 10 seconds if their session exists with Auth0. If not, log them out.
const CHECK_INTERVAL = 10000; // in ms
const check = this.check;
function initInterval() {
setInterval(() => {
check();
}, CHECK_INTERVAL);
}
initInterval();
}
};
</script>
