T
TanStack•2mo ago
genetic-orange

start-clerk-basic: Infinite redirect loop when refreshing session token

Hi! I am using the start-clerk-basic example, with set clerk env variables in .env. I can log in fine. However, when reloading the page, the vite server outputs this:
Clerk: Refreshing the session token resulted in an infinite redirect loop. This usually means that your Clerk instance keys do not match - make sure to copy the correct publishable and secret keys from the Clerk dashboard.
Clerk: Refreshing the session token resulted in an infinite redirect loop. This usually means that your Clerk instance keys do not match - make sure to copy the correct publishable and secret keys from the Clerk dashboard.
Also, the Clerk profile button in the topbar briefly flickers and renders the SignIn button. When adding a debug log into the fetchClerkAuth of the __root route, it shows that userId is null. So it seems like on the server side, we are not able to authenticate correctly with Clerk. Client-side then it works.
5 Replies
extended-salmon
extended-salmon•2mo ago
@wobsoriano
genetic-orange
genetic-orangeOP•2mo ago
Oh and some further info: When hovering over the Posts link, the debug log outputs a valid userId. So pre-rendering seems to be OK. But doing a page reload, we again get the Clerk error about infinite redirects, and userId null.
flat-fuchsia
flat-fuchsia•2mo ago
Yeah the starter needs to be updated. Probably best if you start with this one for now https://github.com/clerk/clerk-tanstack-react-start-quickstart
GitHub
GitHub - clerk/clerk-tanstack-react-start-quickstart: Learn how to ...
Learn how to use Clerk to quickly add secure authentication and user management to your TanStack Start application. - clerk/clerk-tanstack-react-start-quickstart
genetic-orange
genetic-orangeOP•2mo ago
Thank you! I took a look, though I don't think their example does it significantly different from the tanstack one? Both set up the clerk middleware in start.ts, surround the root component in a ClerkProvider, and use const { userId, isAuthenticated } = await auth(); in a server function to check the auth state 🤔
flat-fuchsia
flat-fuchsia•2mo ago
I think the basic one has the clerk sign in component mounted on error somewhere. I need to take a look again Ill try and replicate your error on my end, with the start-clerk-basic template

Did you find this page helpful?