Xano Auth Q: Does Weweb auto logout users when Auth Token expires?

I am using the Xano Auth plugin, and the authentication token is set to expire in 1 day in Xano by default.

Getting this error in the editor whenever I try to fetch a collection:

responseText: “{“code”:“ERROR_CODE_UNAUTHORIZED”,“message”:“The token expired.”}”

My question is, does Weweb auto logout users when the auth token expires?

Because I am still logged in, but basically can’t do anything because the auth token has expired.

Hi @raelyn :wave:

I think only the token-based auth plugin does this but I’m not sure.

Let me ask the tech team and get back to you on that one :slight_smile:

Okay, thank you Joyce, lmk!!! :heart_eyes:

Hi @raelyn,

You got this error in the editor, right ? Did you kept your editor open for 1 day without refresh it once until the token expired ?

Yes I got this error in the editor! Will it happen in the live?

Probably yes.

We check automatically if the token is still valid during the App load, but not after, during your navigation or your actions on the app.

So the issue is your token could expire while you’re using the app (if you keep the tab open in your browser for too long for example).

For now the only way to handle that is to perform manual check at action level.

By adding an on error workflow when you’re doing thing like fetching collection or others xano action so if it throw an error with a status code 401 (meaning you’re not authenticated anymore) you can redirect your user to the login page.

We took notes of this UX issue and will try to improve the plugin in the near future so you don’t have to implement this anymore.

3 Likes

In my Xano login API method, the token expiration is set to 1 year. At the same time, users are constantly being asked to log in again after a short time which is inconvenient. What am I doing wrong and what can be changed?

Sorry, stupid question. But how do I set such a workflow? Basically, how do I identify that the error is a status code 401?

Another question: Once a user logs out and logs in, they have a new Xano auth token for another day, is that right?

Last question: Will Weweb ever automatically log somebody out of their account after a certain period of time? And how do I set that up?

UPDATE: Regarding q1, I figured out how to do it on the workflow itself that was fetching the collection but failed. But is there any way I can do it at the app or page level level?

I tried to do an app-wide workflow to trigger upon “Collection Fetch Error”, but it is not getting that the error is a 401.

I think its a bug caused by a mismatch between the expiration date you set on the xano side and the default expiration date of the cookie used to store it. I will investigate.

1 Like

If you give a look at the error object you should have the status somewhere with the code inside.
On your screenshot you’re looking at the message but you need to check the status I guess.

Another question: Once a user logs out and logs in, they have a new Xano auth token for another day, is that right?

Correct (but depend of xano)

Last question: Will Weweb ever automatically log somebody out of their account after a certain period of time? And how do I set that up?

For now we don’t have this type of mechanism for Xano Auth.

1 Like

Hi @Alexis just checking back on this issue, have there been any updates since June? My app is now live and I need to implement some sort of auto-logout. I am also using Xano as my backend.

What have others done to handle this scenario? Is there some WeWeb functionality I can leverage to auto-logout a user after X minutes of inactivity?

If there was some way to trigger a workflow to run every x seconds/minutes, this would be super easy. But there isn’t, right?

Hi Dorian

did u get anything right with this ?

You can trigger a workflow every x minutes if you want, with a custom javascript step loaded on page load like:

setInterval(()=> {
wwLib.executeWorkflow('abc-123-workflow-id-here')
}, 5 * 60 * 1000)

You get the ID of the global workflow from the “cans” menu.

As others have probably pointed out, this polling approach is both prone to browser error or a moderately clever hacker to it, so you don’t want to rely on it for security. However, for user experience considerations, it probably covers 80% of the situations in which people could get redirected to logout if they are no longer authenticated or because of inactivity.

1 Like

Thanks @raydeck.

Handling token timeout more elegantly seems like a big missing feature from WeWeb, right? As it stands it seems my only option, per @Alexis above, is to handle the 401 error in every single workflow where a Xano call is made.

How do other sites implement this? The ideal scenario in my mind is that as long as the user is interacting with the site, they should not be logged out. If there are no user interactions for X minutes, they should be auto-logged out. Is there no easy way to implement this?

You can implement the check by creating a global workflow that checks for whether the current token is any good (e.g. an auth/me call) and redirects you to login if it is not.

You can use the snippet above to trigger that workflow every n minutes. That way if you have a 1-hour Xano token, and your workflow is firing every 5 minutes, within 5 minutes of the 60 minute mark the user would be logged out (e.g redirected to login)

1 Like

Thanks @raydeck I’ll give it a shot.

Actually @raydeck that doesn’t let the user stay logged in past the 60 minutes if they are still active right? I only want the user to be logged out if they haven’t interacted with the site for more than the defined period of time (say 60 minutes)

I plan to explore a way to add special plugins triggers like “XANO on 401 error” in the next month, it should help solve this kind of scenario :thinking:

For you case you can improve the javascript code like this

    wwLib.getFrontWindow().userActivity = null;
    wwLib.getFrontWindow().onload = resetTimer;
    // DOM Events
    wwLib.getFrontWindow().onmousemove = resetTimer;
    wwLib.getFrontWindow().onkeydown = resetTimer;

    function resetTimer() {
        clearTimeout(wwLib.getFrontWindow().userActivity);
        wwLib.getFrontWindow().userActivity = setTimeout(() => wwLib.executeWorkflow('abc-123-workflow-id-here'), 3600000)
        // 1000 milliseconds = 1 second
    }
3 Likes