LogOut with code

I would like to have my users click a log out button to log out of my program.

It would be equivalent to clicking on the "X" at the right end of the address tab at the top of the screen.

Is there a way of doing that?

Mike

1 Like

Summary

A log out button is wanted inside a Retool app so that clicking it signs the current user out, equivalent to closing the browser tab and returning them to the login page.

AI Response

This is achievable in a classic Retool app without any special component. Add a Button, then configure a click event handler that runs the utils.openUrl() action pointing to your org's logout URL (https://YOURORG.retool.com/logout). Opening that URL ends the session and returns the user to the login screen. Substitute your actual subdomain in place of YOURORG.

Sources

:bookmark: How do I get my operator to Exit from my App
Solved topic covering the same request, with the exact workaround: a button that calls utils.openUrl() to the org's /logout URL to sign the user out and return them to the login page.
:bookmark: How can a user Logout of Retool Portal
Solved topic confirming that navigating to the /logout URL is the supported way to log a user out from within an app.

The Community Team is testing out a new automation. Let us know if it's helpful (or not) by leaving a :heart:, :+1:, or :-1:. Or by marking this post as the "Solution"! Let us know if you have any feedback here. :rocket:

Hi @mdsmith1 ,

Yes, you can trigger a logout directly via JavaScript using Retool's built-in utils.openUrl() function.

Implementation Steps

  1. Create a new JavaScript Query named logout.
  2. Add the following snippet to the JS query panel:

utils.openUrl('https://<your-workspace>.retool.com/logout', { inNewTab: false })

Note: Replace <your-workspace> with your actual Retool domain. Setting inNewTab: false ensures the user is redirected away from the current app directly to the logout page, ending their session.

  1. On your Log Out button component, add an event handler:
  • Event: Click
  • Action: Run Query
  • Query: logout

Here is what worked for me:

await utils.openUrl("https://www.microsoft.com/en-ca/", { newTab: true });

This routes control out of Retool to the Microsoft web site.

Mike

2 Likes

Hey @WidleStudioLLP, thanks for the write-up! One correction on the code snippet:

inNewTab :cross_mark: isn't actually a valid option for utils.openUrl()
the correct key is newTab :white_check_mark:

utils.openUrl('https://<your-workspace>.retool.com/logout', { newTab: false })

See the options in the docs: The Utils JavaScript Library | Retool Docs

Interestingly, { inNewTab: false } still "works" for staying in the same tab, but only by coincidence: since inNewTab isn't recognized, newTab ends up undefined, which is falsy and happens to fall through to the same-tab behavior. If someone tried { inNewTab: true } expecting a new tab, it would NOT actually open one, since the real newTab key was never set. Worth fixing so folks copying this don't get tripped up later! :+1:

1 Like