Kinde•6mo ago

Logging out on refresh

Hi, I have react application with Kinde auth. On localhost everything works perfectly, you can log in and the session is persisted after refresh. But I have a problem with the project that is deployed on azurewebsites.net, so my url is something like this: https://myapp.azurewebsites.net. In here users can log in but are logged out after refresh, what might be the problem? The configuration on kinde dashboard looks good. this is my provider: <KindeProvider clientId='xxx' domain='https://xxx.kinde.com' redirectUri={window.location.origin} logoutUri={window.location.origin} > <App /> </KindeProvider> Thank you in advance

9 Replies

Abdiwak•6mo ago

Hi Temo, Thanks for reaching out. I just need a few details to better understand and help fix the issue: 1. What authentication method are users using to sign in? 2. What SDK and version are you currently using? 3. Have you tried deploying the project on another test platform like Vercel to see if the issue still happens?

Thanks

TemoOP•6mo ago

Thank you for the response 1. we are using email + password, Apple, Facebook, Google. 2. I am using v4.0.4 3. Have not tried this yet I also tried to update to version 5 but I get this kind of errros: Can't import the named export 'KindeProvider' (imported as 'KindeProvider') from default-exporting module (only default export is available) I am using react v18, which might be the problem (not sure yet)

Abdiwak•6mo ago

Thanks for the response. While we check the issue, could you also try it on a test platform like Vercel to ensure the issue isn’t coming from azurewebsites.net?

TemoOP•6mo ago

the only thing that helped was this: isDangerouslyUseLocalStorage={true} is there another, better way to fix this?

Abdiwak•6mo ago

Hey, Temo..
The solution is to use Kinde's Custom Domain. And I just noticed that the KindeProvider you shared at first, it uses a 'xxx.kinde.com' domain. For this to fully works, you need to use your custom domain instead.

<KindeProvider
    domain="https://your-custom-domain.com"  // Your custom domain instead of *.kinde.com
    clientId="<your_kinde_client_id>"
    redirectUri={window.location.origin}
    logoutUri={window.location.origin}
>
    <YourApp />
</KindeProvider>

<KindeProvider
    domain="https://your-custom-domain.com"  // Your custom domain instead of *.kinde.com
    clientId="<your_kinde_client_id>"
    redirectUri={window.location.origin}
    logoutUri={window.location.origin}
>
    <YourApp />
</KindeProvider>

Can you check this one and let me know, also remember to update your application's environment variables and configuration to use the new custom domain URL after it's set up.
For more information about setting up custom domains in Kinde, you can visit :
https://docs.kinde.com/build/domains/pointing-your-domain/

TemoOP•6mo ago

ok thanks, will try

Abdiwak•5mo ago

Hi Temk, Just checking in to see if everything is working for you. Let me know, Thanks

Filipp Trigub•5mo ago

Sidenote: can confirm, that version >5 fails with Can't import the named export 'KindeProvider' (imported as 'KindeProvider') from default-exporting module (only default export is available)

Abdiwak•5mo ago

Yes thats correct, this is because in version 5, the SDK was optimized for React 18+ and the import structure was changed.

Gaming

Programming

Logging out on refresh

Did you find this page helpful?