Auth0 Home Blog Docs

Losing login credentials on refresh using @auth0/auth0-spa-js

I tried looking, to the best of my ability, in this community if anyone else is experiencing this issue, but I couldn’t find anything so here I am with this problem.

LIke the title suggests, when I login and then when I refresh, my browser loses the login credentials and then asks me to login again.

I’m following the tutorial in the quick start section for react very closely and it says to whitelist urls using the “allowed web origins” input so that it can automatically refresh the authentication tokens. I think I’m doing just that:

48%20PM

But I’m not getting the proper response. Cany anyone point me to the right direction?

I tried the quick start React tutorial (same as on github here), and the browser refresh works just fine, I remain logged in (the SPA SDK, in particular the auth0Client should handle this silent authentication automatically).

Are you running it on http://localhost:3000 (if not, can you try to run it on localhost)? Do you see any Javascript errors in the browser developer console or any network errors in the developer console / network tab?

Note that the silent authentication only works on secure connections, so either localhost and/or https, but from what I see, that should be the case for you already, so that shouldn’t be the issue.

1 Like

com-video-to-gif%20(3)

I am running on http://localhost:3000, the only errors I see is the SSO one. And I deployed it to netlify just to make sure it works in a deployed state, but it still doesn’t.

and just to make sure I covered all bases I also added localhost:3000
52%20AM

I’m starting to think this is a me problem. I went ahead and deployed the Github repo that you linked here: https://peaceful-chandrasekhar-be5274.netlify.com.

I just tested your example, and indeed, automatic login doesn’t happen. Comparing the requests with my local instance, I see that the POST https://dev-yourtenant.auth0.com/oauth/token (silent authentication) isn’t made as it’s the case in my instance.
Don’t know about the reason for this adhoc, as I’m not too familiar with the new auth0-spa-js in detail myself yet, but that’s my finding so far.

1 Like

Am I missing something in my settings that would maybe be the cause of that? The only difference between your local instance to my local instance and netlify deployment is whatever settings i have in my tenant. Am I doing something wrong here; do I have anything that might be missing that I need to add?

Nothing I can think of, don’t see anything wrong with your settings. Maybe other colleagues have an idea.

1 Like

Thanks a lot @mathiasconradt! I can however say one thing, there was one instance that it did keep me logged in when I refreshed the page. After that, I then tried to do it again on a different time, it went back to this current behavior.

I just see this in your animated gif file above:

Can you follow the advice and add https://dev-awanin.auth0.com to the Allowed Web Origins, see if it helps.

I went ahead and added https://dev-awanin.auth0.com to it but the behavior is still the same. I stil also get that same warning as well.

I tested my localhost application against your Auth0 tenant and clientID (put your values in my auth_config.json). And in fact, I then also get that problem. So it really seems to be related to the tenant.

Then, I went ahead and tested it with a different tenant of mine (a free tenant in the US region, instead of my default Enterprise one in EU), and I get that same behaviour like with yours there as well.

So, it seems to be something with the different tenants, no idea why though yet. Will try to do some more digging tomorrow.

1 Like

@cjbt Please test the following:

  1. Instead of logging with the Google / Log in with Google, can you try with a database user instead (username + password) - does it work now?

  2. I assume you’re currently using the default Auth0 dev keys for the Google social connection. Can you try to replace it with proper Google API credentials.

I found that this makes a difference.

2 Likes

It worked!

And im not able to change my client id in my connection settings. Is that due to any tiered permisions? Do I have to pay for that option?

No, that’s not a paid option. What exactly is the problem? Field not editable?

for me it’s currently grey’d out

24%20PM

This screen looks a bit different than mine. I think you’re in the wrong screen. You need to set it under

Dashboard > Connections > Social > Google

not under Dashboard > Applications > [Your application]

I’m talking about the credentials for the Google API. I am referring to the setup following:

3 Likes

It worked!!! Thank you @mathiasconradt for you help!

2 Likes

Glad you have it working @cjbt!

1 Like

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.