ClerkJS: Token refresh failed. TypeError: Failed to fetch. Please try again.

[kachar]

• [x] Review the documentation: https://clerk.com/docs
• [X] Search for existing issues: https://github.com/clerkinc/javascript/issues
• [x] Go through package changelog files.
• [x] Provide the Frontend API key from your application dashboard.

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_live_Y2xlcmsudGVhbS1ncHQuY29tJA

Package + Version

• [ ] @clerk/clerk-js
• [ ] @clerk/clerk-react
• [x] @clerk/nextjs - 4.23.2
• [ ] @clerk/remix
• [x] @clerk/types - 3.49.0
• [x] @clerk/themes - 1.7.5
• [ ] @clerk/localizations
• [ ] @clerk/clerk-expo
• [x] @clerk/backend - 0.27.0
• [ ] @clerk/clerk-sdk-node
• [ ] @clerk/shared
• [ ] @clerk/fastify
• [ ] @clerk/chrome-extension
• [ ] gatsby-plugin-clerk
• [ ] build/tooling/chore
• [ ] other:

Dependencies + versions

Provide a json with the dependencies used in your project (copy paste from yarn.lock / package-lock.json) or a github project / template that reproduces the issue.

*Include the @clerk/ packages and their versions!**

Example:

{  
  "dependencies": {
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "next": "13.4.16",
    "axios": "^1.4.0",
    "@clerk/backend": "0.27.0",
    "@clerk/nextjs": "^4.23.2",
    "@clerk/themes": "1.7.5",
    "@clerk/types": "3.49.0",
    "@sentry/core": "^7.64.0",
    "@sentry/nextjs": "^7.64.0",
    "@sentry/node": "^7.64.0",
    "@sentry/profiling-node": "^1.1.2",
    "@sentry/utils": "^7.64.0"
  }
}

Browser/OS

If applicable e.g. Chrome {version}, Node {version} , Bun {version} , Cloudflare worker {version}

Description

We're experiencing a severe number of errors reported by Sentry regarding the Clerk user authentication. It happens ad-hoc and between releases.

Error
ClerkJS: Token refresh failed (error='ClerkJS: Network error at "https://clerk.our-domain.com/v1/client/sessions/sess_2TwhWEx3j9IvWXU0qOtEwutNLx2/tokens?_clerk_js_version=4.53.0" - TypeError: Failed to fetch. Please try again.')

Is there anything we can do to improve this process and reduce the errors for our customers?

[manutzsong]

I also have "Failed to fetch problem"

Solved it by downgrade to "@clerk/nextjs": "4.21.13",

[jescalan]

👋 Hey there @kachar! this is an issue that can happen with bots, but if it's happening with users it's a concern. If it's a bot, we should be able to block the bot as well (cc @anagstef)

Have you seen this error reported by real users or been able to reproduce it in any way? If not, you may be able to mute the error and move on.

@manutzsong - this seems like it is a separate issue, would you be willing to open a new issue to discuss this? Any more details you can provide, or a reproduction would be very useful here too.

[tmcw]

I can confirm that this is not a bot issue - we get it on a variety of browsers, and for logged-in users in Sentry:

[Andriy-Kulak]

@jescalan - we are getting a token refresh issue as well. it's a bad issue because the client essentially is locked out from the website and has to change browsers or clear cache. can you please look into this?

It's not acceptable for customers to be dealing with this & I see the same sentry errors as @tmcw . I unfortunately cannot recreate this issue locally.

[jescalan]

We'll discuss this one again, but it's quite difficult to look into without any way to reproduce it. Thank you both for the followup!

[dimkl]

Hello @Andriy-Kulak, Are you getting a Token refresh failed ... TypeError: NetworkError ... or is it another type of token refresh failed issue? There are multiple token refresh failed errors.

The above error is related to a NetworkError which may be caused by :

• CORS
• Networking issue

ref: https://github.com/JakeChampion/fetch/issues/310

Is it possible to have any of the following information:

• https://replay.io/ recording
• a HAR of a failed request
• check the console if there is any CORS related error

cc: @tmcw , @kachar

[Andriy-Kulak]

@dimkl there were no cors errors This is the full error (abstracted our domain). What is HAR? does below help?

Error: ClerkJS: Token refresh failed (error='ClerkJS: Network error at "https://clerk.{ourdomain.com}/v1/client/sessions/sess_2UpTfftYexW5yvzcs9XhVau3uy8/tokens?_clerk_js_version=4.57.0" - TypeError: Failed to fetch. Please try again.')

This is not related to a firefox add on so https://github.com/JakeChampion/fetch/issues/310 doesn't seem related

[dimkl]

@Andriy-Kulak the ref of https://github.com/JakeChampion/fetch/issues/310 was added as a resource link for the causes I mentioned. I'm sorry for the misunderstanding, I didn't intend to indicate that the Firefox add-on was your issue.

Also, you can generate a HAR file following this: https://www.inflectra.com/Support/KnowledgeBase/KB254.aspx

Since you didn't find any CORS or Network related information on your Dev Tools a https://replay.io/ recording would be really helpful to pinpoint the issue.

[clerk-cookie]

Hello 👋

We currently close issues after 40 days of inactivity. It's been 30 days since the last update here. If we missed this issue, please reply here. Otherwise, we'll close this issue in 10 days.

As a friendly reminder: The best way to see an issue fixed is to open a pull request. If you're not sure how to do that, please check out our contributing guide.

Thanks for being a part of the Clerk community! 🙏

[emilpriver]

hello, I am experiencing this as well running on cloudflare pages togheter with remix. I sometimes get a token and sometimes don't get a token.

There is no pattern to this

[tmcw]

Here's an example from production. I had a tab in the background for a bit. Clerk requests a new token twice, then the third time fails, which causes the next time we request resources to fail, and for the page to crash because resources got 401 response codes.

[philefstat]

Also experiencing this with nextjs. And like @tmcw 's comment above, it seems to make many requests of which most succeed but the last one fails

[EddyVinck]

I am getting this error with Next.js when I lose my internet connection (e.g. turn off mobile hotspot when travelling)

[jescalan]

Hey everyone - we're sorry that this is a frustrating error. We have discussed this as a team on several occasions, it's a generic network error that can happen for a variety of reasons, and is very difficult for us to look into without a way to consistently reproduce it. We're going to leave this issue open for now in case anyone is able to find a way to reproduce, but want to note that we aren't actively working on it.

If anyone is able to produce a reproduction or is aiming to do so, this guide would maybe be helpful - alternately if it can be captured via replay that would be very useful as well.

[saahirfoux]

@jescalan As a developer, I will try to describe how to reproduce as best as I can.

• Login at anytime of the day, it doesn't matter, on wireless network "A".
• Continue inside of your application without logging out.

The next few steps are Pure theories, guesses. I suspect one of them is why I have seen this error twice in the last three days.

• Close your laptop and relocate to an entirely different wireless network
• Disconnect or lose connection to a wireless network during the time when ClerkJS is attempting to grab a new refresh token. (I don't even know what the default is at this second. May speed things up for your team to simply set it to 60 seconds.)
• Once you re-connect to a new wireless connection, wait for Clerk to attempt to refresh the token.

Next time I encounter this error I will share the HAR file.

I work from several cafe's during the day for fun while coding, and I don't consistently get the error even then, so please remember the above is just my best guesses.

[clerk-cookie]

Hello 👋

We currently close issues after 40 days of inactivity. It's been 30 days since the last update here. If we missed this issue, please reply here. Otherwise, we'll close this issue in 10 days.

As a friendly reminder: The best way to see an issue fixed is to open a pull request. If you're not sure how to do that, please check out our contributing guide.

Thanks for being a part of the Clerk community! 🙏

[clerk-cookie]

After 8 days without a reproduction being supplied, we are closing this issue. Keep in mind, I'm just a robot, so if I've closed this issue in error, please reply here and my human colleagues will reopen it. Likewise if a reproduction is prepared after it has been closed.

[robhadfield]

Hey - Did anyone in here get to the bottom of this?

I agree with @saahirfoux that it's a timeout of sorts. If I leave a browser tab open and come back a few hours later there is an error waiting for me Error: ClerkJS: Token refresh failed (error='Cannot read properties of null (reading 'jwt')')

I understand it's hard to replicate to fix but can you give any guidance on how I can catch it?

[thefapinstructor]

Hey @jescalan , I'm seeing this error quite a bit in my app. The app is pay walled so I'm confident that these are real users (not bots).

Not sure if this helps but it looks like the error is origination from /npm/@clerk/clerk-js@4/dist/clerk.browser.js

The error is

ClerkJS: Token refresh failed (error='ClerkJS: Network error at "https://clerk.fapchallenger.com/v1/client/sessions/sess_<id...>/tokens?_clerk_js_version=4.72.1" - TypeError: Failed to fetch. Please try again.')

I currently only have one session reply but it happens about 2 min and 20 seconds after the user verifies their email after creating the account.