I like @Alexis code! The workflow in question would need to delete the locally stored authentication token then redirect the user to the logout page.
It’s not really a secure method. The token is still good. Any reasonable red teamer would still have access. But a casual user would experience a logout.
The global workflow can call the logout xano action, it will clear everything (cookies and plugin variables) 
@Alexis you are a GENIUS! This worked perfectly, thank you! And thank you @raydeck for moving the ball forward! I would mark this solved if I could, but I’m not the OP. 
One follow-up question please, if I may be so presumptuous.
I would also like to set a variable to true when the timeout occurs, so that I can show a message on the Login screen after logout. I figure the variable has to be set to ‘save in local storage’. But I can’t figure out how to update the code to set that variable to true. I tried asking ChatGPT but it’s suggestions either don’t work at all, or cause the logout to occur even when there is user activity.
Thanks.
Hi, you can add it inside your workflow, before the logout and redirection, it doesn’t need to be inside the js code
Create a boolean variable with preserve on navigation (doesn’t need to be local storage) to store the information. Add a change variable value action on your workflow to toggle it to true.
On the page you redirect your user you can have a modal showing up if this variable is true
Is there a more elegant way to do this now? Is there a way to just have an overall on “401” error handling than going to each workflow? Also if the collection is fetched automatically where would you put the 401 error handling?
Thanks!
We are discussing about it, we will probably push a new global trigger “on 401 error” (or on request fail and then let you check the type ?), so you can manage global logic here to handle such usecase
In the meantime, for collections you have an on collection fetch error trigger
Hello Alexis,
where to put this javascript code for the resetTimer and executeWorkflow?
In the Head of the Project custom code?
With a around?
And what is the “cans” menu where i can find the workflow id?
thanks for helping.
Stefan
or is there now any plugin for that?
Hi, for now it still not easy to handle this usecase, but we finally planned the feature I mentioned previously (new trigger to react on 401 requests)
In the meantime, an easiest way would be to use this code on app load
wwLib.getFrontWindow().axios.interceptors.response.use(
response => response,
error => {
if (401 === error.response.status) {
wwLib.executeWorkflow('<global-workflow-id')
}
return Promise.reject(error)
});
It will attach an interceptor on the library we use to make api requests to Xano, this interceptor will listen and react on 401 error and so you should be table to execute your workflow at this moment, the workflow could call your logout action and redirect the user to the login page for example.
The advantage of this method is you don’t have to check and make many requests every x seconds/minutes.
The downside is it will react to any 401 error (if you perform also request to something else and not only xano ?), but probably if you get a 401 error (meaning unauthenticated) you want to redirect to the login page no matter what’s the error source.
If you prefer the interval method, you can put it on app load too. And to get the workflow id you just have go to your workflow. But you have to enable dev information first (More => Development => Show dev informations)
hello @Alexis, does WeWeb have a global 401 workflow now or is the custom JS still the workaround to use?
Cheers
You still have to rely to custom js for now
Thank you Alexis for confirming,
If I got it right, I’ve created a workflow on app load with a custom JS action where I copy/pasted your piece of code and replace the 401 workflow with my global workflow ID.
Is it the right way because when I bump into 401, nothing happens (UI and log wise).
Cheers
Could you try axios instead of wwLib.getFrontWindow().axios?
negative this is the JS code I have
axios.interceptors.response.use(
response => response,
error => {
if (401 === error.response.status) {
wwLib.executeWorkflow('3e53dbe5-cf39-4526-a44e-eb6bc232f105')
}
return Promise.reject(error)
});
I can see in the logs the JS workflow being executed but when a 401 is hit, nothing happens.
I think the issue is both solution works but only in the published app, in the editor it should be wwLib.getEditorWindow().axios, you can use it for testing purpose and then put it back to getFrontWindow() or only axios before publishing
thank you Alexis, it works like a charm. Next step, have it natively with the Xano plugin