isAuthenticated from useConvexAuth flashes true, lands at false, even though auth0 is authenticated
Hi, I'm following the auth0 guide and running into an issue, would love some help!
Issue: I'm using the boilerplate code from the guide, and useAuth0 from auth0/auth0-react is returning a logged in user. But useConvexAuth still shows the user unauthenticated (isAuthenticated: false). If I refresh the page, isAuthenticated is set to true for a second and then back to false.
What should I do?
Auth0 Guide: https://docs.convex.dev/auth/auth0#get-started
Convex Auth0 | Convex Developer Hub
Auth0 is an authentication platform providing login via
67 Replies
My convex.json shows the correct domain and applicationId under
authInfo
for my auth0 app.Does this snippet from our docs clarify things at all?
Use the useConvexAuth() hook instead of the useAuth0 hook when you need to check whether the user is logged in or not. The useConvex hook makes sure that the browser has fetched the auth token needed to make authenticated requests to your Convex backendMy understanding is there's always a brief amount of time where
useAuth0
and useConvexAuth
disagree, because Auth0 knows that the user is authenticated, but we're still in the process of making sure Convex is aware that the user is authenticated, which is why we recommend useConvexAuth
as the authority for logged in or not.
Does this sound like what you're seeing? Or is useConvexAuth
never showing isAuthenticated: true
?useConvexAuth is showing
isAuthenticated: true
for at most a second, right after I refresh the page, and then it sets to false
.
It makes sense that there's a brief moment when they could be out of sync, but I would expect they would eventually show the same authentication status! I'm not sure why it ends up as auth0 authenticated and convex not authenticated. Might have done something dumb but I'm not sure where to start to debug!Not sure what impact it actually has, but are you simultaneously using both
useAuth0
and useConvexAuth
? Or did you fully switch from the former to the latter?
I haven't tried having both but could imagine that they might conflict [if used within the same component]
But if that were actually the case, it'd be a bug, because you get different information from bothI import them into different components, but I don't think that should matter even if they were in the same component because I'm only reading values from them and not calling any methods to change anything
Also HIII
hello!! trying to get on a computer now to see if I can repro this
I can also share my screen and you can see it, not sure if I've set something up weird. Can't share my repo though bc it's private :p
hi quick question from the sidelines - what version of convex are you running? there's a bug in authentication states that we fixed in 0.14.1
I just signed up for convex today and used the convex-tutorial repo. I'll check the version
"dependencies": {
"@auth0/auth0-react": "^2.1.0",
"convex": "0.14.1",
"react": "^17.0.2",
"react-dom": "^17.0.2"
},
thanks for checking. it's not the known bug then
One more thing to confirm -- in your
index.js
or wherever your root component is, you're using an Auth0Provider
that wraps a ConvexProviderWithAuth0
(not just a regular ConvexProvider
?)hmm, yeah, that looks totally correct. so if you simultaneously use Auth0's
isAuthenticated
it stays true
as expected, but the one from useConvexAuth
flips back to false
?That's correct. I'm displaying both variables on the app UI and I see the convex one flash true for < a second
Any errors in the console? I think this would imply that you've successfully logged in with Auth0 and gotten an identity token back, but Convex is rejecting that identity token for some reason
No errors in the console running
npm run dev
I'd probably want to verify that the
domain
and applicationID
in convex.json
match the values in the .env
file you set
(those are the values you set with convex auth add
)
specifically, ensure the value in convex.json
is of the form https://dev-<some-id>.us.auth.com/
I briefly checked and it looked a match, but I didn't go char by char. I'm afk a few min but will look when I'm back!
ok, let me know! I'd also double check the browser console + network tab, in case there's any error there which isn't in your terminal
got a request HAR from Fay and it looks like the Convex client successfully authenticates against Convex but then a second later "logs out" and sends an empty auth token
(coming back from DMs)
The URLs were a match too
interestingly, it looks like there's also no requests to Auth0 in the HAR you sent
Okay let me preserve network history, and do a fresh log in
yeah, seeing the same behavior there -- looks ok on the auth0 end, and convex gets the auth successfully at first, but then it logs back out
@fay still up to screenshare?
Yup!
I'll send a zoom
Actually you send one, the only paid Zoom account I have is for work and I don't want to use that one for this :p
cool, just DM'd a link
@ballingt I found why I changed that 4-option config I showed you https://community.auth0.com/t/401-unauthorized-when-obtaining-token-in-authorization-code-grant/44685/3
Auth0 Community
401/Unauthorized when obtaining token in Authorization Code grant
Here’s the sequence I’m going through to get a basic (Quickstart) SPA application (in React) working. I’m guessing I could probably eliminate a step or two in the middle, but thought that listing my tested sequence accurately would be helpful: Create new Auth0 tenant (which creates default app) Within default app, fill in “http://localhost:3...
Search "Yup, there’s a much shorter (though still somewhat strange path) to achieve success:" in that page. I skimmed most of it as it wasn't relevant, I wasn't doing Machine to Machine auth. But I was getting a 401 from auth0. That issue went away after I changed that 4-option to None
Great, thanks!
@fay I wonder about your auth0 settings, since we had to change it back from standard web app to single page app I think some settings were different.
we expect these to be toggled
Just tried it, still getting same results though
Just tried the flow, these are the settings I get when I create a new Auth0 application after selecting SPA here
ok thanks for checking
No advanced settings
Is this app just cursed, should I retry with a brand new app 😹
by default the Inactivy Expiration would also be checked
ha at least for debugging I think that might help! I don't know an understanding of every option so starting with something that should be the same could be great
Checked that off too, still same issue
For one more thing to add to your iteration cycle, you could try clearing cookies + local storage
OMG that worked
Damn I wish I saved what those cookies were before I cleared them
I think some settings changes may not take effect until clearing depending on the settings; if it's a property of the token that is stored the old token won't be updated
Yeah now it hits the first breakpoint twice
You still might want to check why it's hitting that one twice (is that intentional?) But at least it's not erroring the second time with missing token though!!!
great, good to know that that's the expected path there
Honestly... I'm facepalming for not clearing sesh/cookies earlier hahaha
cool yeah will figure this out
I think the goal of this may be to check that we could refresh right away, making a "my users are getting logged out after an hour/day" into a "my app is obviously broke" problem
but I'm making that up, I will check
THANK YOU TOM!!!! Appreciate your help 🙂 And the other folks in channel who suggested things too!
re not clearing sesh/cookies same
Do y'all have a standard practice for marking this question as solved?
Yes and I never remember to, thanks for the reminder
✅
(and thanks @gautamg who suggested these settings)
I'm running into this same behavior, with the odd twist that it's working fine in Chrome but failing in Firefox and Safari. I've checked my auth0 app settings and cleared my history, per the discussion in this thread, but to no avail.
Any other ideas?
Update: it looks like it has to do with privacy preferences in each browser. In Firefox, it works if I disable dynamic state partitioning. In Safari, I need to turn disable "Prevent cross-site tracking" altogether.
Hey Gray, what is the behavior you’re seeing with Prevent Cross-site Tracking turned ON?
One note is that I'm not using React, so have rolled my own auth0 - Convex integration based on examining the React implementation; not sure if there's any kind of special handling in the React implementation that I may have missed.
@Gray oh yeah? interesting. out of curiosity, what environment/framework are you using Convex in?
Hi, Michal. I'm seeing more or less exactly the same behavior described in the original post on this thread—I get one callback from the Convex client saying that Convex is authenticated, then a moment later a second one saying it's not
we're definitely starting to build a list of other environments we plan to add first-class support soon
Hi, Jamie! I'm currently using Lit to render and Preact Signals for state management, but my objective was really just to see if I could make a more generic "reactive client" for Convex that didn't depend on any React-specific abstractions (e.g. hooks, context).
Need to hop out for a while, but I'll circle back here later. I've been planning to ping the general chat here about my experimentation with framework-agnostic reactivity, but haven't quite gotten it to a state where it's ready for that and haven't had time to touch it for a couple of weeks, either.
very cool
OK, figured it out. For posterity, in case anyone else with similar symptoms finds their way to this thread: it turns out that I wasn't including
useRefreshTokens: true
and cacheLocation: 'localstorage'
in my auth0 client config. These options are noted in the Convex docs, but since my non-React use case had me off the beaten path I didn't end up noticing.Hello! I have a similar issue too. Tried everything thats previously done, here is how it looks when I console.log isAuthenticated from
useConvexAuth
hook. All data form useAuth0
hook looks good.Here is how Auth0 is confugured
Can you pls help?
Hey @Siraj , what does your frontend provider code look like?
Here you go!
tried with and without verbose.
still same, no extra additional information
If you look into the network tab in Chrome dev tools, do you see a request failing to Auth0? What the ConvexProviderWithAuth0 does is that after the initial login (when you logged
true
), it tries to fetch a new token from Auth0 using cacheMode: "off"
. It seems that this is fails, so your client gets logged out again.
Do you have MFA turned on? (There are a lot of Auth0 settings, you might want to start a new application from the SPA config to compare all the various settings (or just switch to the new one).Thank you!
I had the
rotation
off because I was receiving access denied error from auth0 after login.
Now, I see app logs and just before isAuthenticated
becomes false
after true
, there is an error in the logs that looks likes this.
Here is the screenshot of the full logs, maybe its because of rotation turned off. I'll try to turn it back on and fix the error.