Using NextAuth.js with Netlify deploy-preview sites

I am trying to use NextAuth on preview version of my site, but I keep getting this error in the console [next-auth][error][CLIENT_FETCH_ERROR] and when i try to visit the login page, i get the error in the image below. According to this doc, the NEXTAUTH_URL should have been set automatically and looking at the logs this seems to be the case since I can see this in the logs 2:04:00 AM: ​ 2:04:00 AM: NextAuth package detected, setting NEXTAUTH_URL environment variable to https://deploy-preview-21--weedle.netlify.app 2:04:00 AM: { functionsDir: '/opt/build/repo/.netlify/functions-internal' }. Can’t quite figure out why i’m still getting this error.

I have also followed this article here https://answers.netlify.com/t/using-nextauth-with-deploy-prime-url/51881/3 and included a netlify.toml file with no luck. Please help on this

My site name for the preview url is https://deploy-preview-21–weedle.netlify.app/. Thanks in advance

Error on login page visit

Hi @WeedleApp :wave:t6: ,

Welcome to the forums and thanks so much for reaching out.

Can you please first Clear cache and cookie of your browser and the error should be removed or at least that’s helped a few others in the past.

If that doesn’t work can you confirm what your envr variable is set to and what you’ve tried to resolve this?

Hi @SamO … thanks for the response… I tried clearing cache and even incognito, didn’t work.

Here is what I have tried.

  • Since according to the netlify docs, the url will be automatically set, I initially didn’t set an environment vars. Looking at the logs I noticed its being set already (Image included below).

  • Since I don’t know the preview url before hand, I followed the instructions here to use the netlify.toml file in setting it. Here is what the netlify.toml looks like

[context.production]
command = "yarn build && echo \"NEXTAUTH_URL=$URL\" > .env.local"

[context.deploy-preview]
command = "yarn build && echo \"NEXTAUTH_URL=$DEPLOY_PRIME_URL\" > .env.local"
  • I also manually set NEXTAUTH_URL as an environment variable to https://deploy-preview-21--weedle.netlify.app/ and rebuilt, still didn’t work.