next-auth icon indicating copy to clipboard operation
next-auth copied to clipboard

Google Oauth failed when Github runs ok : Server error There is a problem with the server configuration.

Open wuzhuzhu opened this issue 1 year ago • 17 comments

Provider type

Google

Environment

System: OS: macOS 14.3.1 CPU: (11) arm64 Apple M3 Pro Memory: 351.67 MB / 18.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 21.6.1 - ~/.nvm/versions/node/v21.6.1/bin/node npm: 10.2.4 - ~/.nvm/versions/node/v21.6.1/bin/npm bun: 1.0.25 - ~/.bun/bin/bun Browsers: Chrome: 121.0.6167.184 Safari: 17.3.1 npmPackages: next: latest => 14.1.0 next-auth: beta => 5.0.0-beta.13 react: ^18.2.0 => 18.2.0

Reproduction URL

https://github.com/wuzhuzhu/authjs-google-issue

Describe the issue

login by google leads to error screen: image

Error on terminal:

✓ Compiled /api/auth/[...nextauth] in 98ms (633 modules) [auth][error] TypeError: fetch failed at node:internal/deps/undici/undici:12442:11 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async globalThis.fetch (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:57569) at async getAuthorizationUrl (webpack-internal:///(rsc)/./node_modules/@auth/core/lib/actions/signin/authorization-url.js:23:35) at async Module.signIn (webpack-internal:///(rsc)/./node_modules/@auth/core/lib/actions/signin/index.js:19:60) at async AuthInternal (webpack-internal:///(rsc)/./node_modules/@auth/core/lib/index.js:73:24) at async Auth (webpack-internal:///(rsc)/./node_modules/@auth/core/index.js:126:29) at async /Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:63809 at async eU.execute (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:53964) at async eU.handle (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:65062) at async doRender (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/base-server.js:1333:42) at async cacheEntry.responseCache.get.routeKind (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/base-server.js:1543:40) at async DevServer.renderToResponseWithComponentsImpl (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/base-server.js:1463:28) at async DevServer.renderPageComponent (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/base-server.js:1856:24) at async DevServer.renderToResponseImpl (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/base-server.js:1894:32) at async DevServer.pipeImpl (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/base-server.js:911:25) at async NextNodeServer.handleCatchallRenderRequest (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/next-server.js:271:17) at async DevServer.handleRequestImpl (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/base-server.js:807:17) at async /Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/dev/next-dev-server.js:331:20 at async Span.traceAsyncFn (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/trace/trace.js:151:20) at async DevServer.handleRequest (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/dev/next-dev-server.js:328:24) at async invokeRender (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/lib/router-server.js:163:21) at async handleRequest (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/lib/router-server.js:342:24) at async requestHandlerImpl (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/lib/router-server.js:366:13) at async Server.requestListener (/Users/walter/repositories/next-auth/apps/examples/nextjs/node_modules/next/dist/server/lib/start-server.js:140:13)

How to reproduce

Google api console settings: Publishing status :In production

OAuth credentials settings: image image

# .env.local
AUTH_SECRET=f5679fe688efc******

AUTH_GITHUB_ID=3f96f3923******
AUTH_GITHUB_SECRET=ed3cda881******

AUTH_GOOGLE_ID=133689906618-7n8h7******
AUTH_GOOGLE_SECRET=GOCSPX-JSbBe73H4O******
# auth.ts
import NextAuth from "next-auth";

import GitHub from "next-auth/providers/github";
import Google from "next-auth/providers/google";

import type { NextAuthConfig } from "next-auth";

export const config = {
	theme: {
		logo: "https://next-auth.js.org/img/logo/logo-sm.png",
	},
	providers: [
		GitHub,
		Google,
	],
	callbacks: {
		authorized({ request, auth }) {
			const { pathname } = request.nextUrl;
			if (pathname === "/middleware-example") return !!auth;
			return true;
		},
	},
} satisfies NextAuthConfig;

export const { handlers, auth, signIn, signOut } = NextAuth(config);

Expected behavior

Google oauth works fine as Github does.

wuzhuzhu avatar Feb 21 '24 05:02 wuzhuzhu

Have you tried adding http://localhost to both Authorized redirect URIs and Authorized JavaScript origins? After the introduction of Google Identity you need both http://localhost and http://localhost:3000 (in this case) to run the application. It should look something like this: image

ShlokBharadwaj avatar Feb 23 '24 08:02 ShlokBharadwaj

I tried add localhost into authorized origins and redirect URIs like this: image But still not work.

google says "Note: It may take 5 minutes to a few hours for settings to take effect", its 10mins ago, i will try again in next day.

wuzhuzhu avatar Mar 04 '24 05:03 wuzhuzhu

I tried add localhost into authorized origins and redirect URIs like this: image But still not work.

google says "Note: It may take 5 minutes to a few hours for settings to take effect", its 10mins ago, i will try again in next day.

Add http://localhost:3000 and http://localhost to Authorized redirect URIs as well.

ShlokBharadwaj avatar Mar 04 '24 13:03 ShlokBharadwaj

image still not working..

wuzhuzhu avatar Mar 05 '24 10:03 wuzhuzhu

I reproduce the same APP for GITHUB providers for testing purpose, login with GITHUB also not working, although i just added the github id and github secret key just, rest each and everything is same, Don't know what is the issue

azad-nft avatar Mar 11 '24 13:03 azad-nft

I have same problem. any one can slove it? Credentials 401Error

OKHand-Zy avatar Mar 13 '24 01:03 OKHand-Zy

I also got the same error but then I followed this video and things worked out perfectly. Hope it helps.

ShlokBharadwaj avatar Mar 13 '24 01:03 ShlokBharadwaj

This is what I get. Is there any way we can show more information like the original request to & response from google?

[auth][error] TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11730:11)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)
    at getAuthorizationUrl (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/signin/authorization-url.js:24:35)
    at Module.signIn (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/signin/index.js:16:56)
    at AuthInternal (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/index.js:72:24)
    at Auth (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/index.js:126:34)
    at /path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:207:37
    at e_.execute (/path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:122:26)
    at e_.handle (/path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:269:30)
    at doRender (/path/to/my-saas-project/node_modules/next/src/server/base-server.ts:2273:30)
image

/

And I believe I'm doing everything as the docs describes https://next-auth.js.org/providers/google

  '@auth/[email protected]':
    resolution: {integrity: sha512-UKk3psvA1cRbk4/c9CkpWB8mdWrkKvzw0DmEYRsWolUQytQ2cRqx+hYuV6ZCsngw/xbj9hpmkZmAZEyq2g4fMg==}

Authorized JavaScript origins

http://localhost:3000
http://localhost

Authorized redirect URIs

http://localhost:3000/api/auth/callback/google
http://localhost/api/auth/callback/google
http://localhost:3000
http://localhost
export default {
  debug: true, 
  providers: [
    Google({
      clientId: env.GOOGLE_CLIENT_ID,
      clientSecret: env.GOOGLE_CLIENT_SECRET,
    }),
...

addlistener avatar Jun 09 '24 13:06 addlistener

I also got the same error but then I followed this video and things worked out perfectly. Hope it helps.

This video uses pure react without next.js or next-auth. So you abandoned next-auth? @ShlokBharadwaj

addlistener avatar Jun 09 '24 13:06 addlistener

My problem is actually this one https://github.com/nextauthjs/next-auth/issues/3920

I switched to next-auth v4 to have figured out it's actually the request timed out. Maybe next-auth v5 could improve on error logging.

addlistener avatar Jun 10 '24 06:06 addlistener

Why there isn't a solution for this so popular issue, every application will chose to use goole login provider as thier first choice

TUTUBIG avatar Jun 27 '24 18:06 TUTUBIG

I met the same problem, I try much but no solution. this problem only occur in localhost, it works fine if I deploy to vercel

AlanGolphi avatar Jul 08 '24 07:07 AlanGolphi

I got the same error.

kamjin3086 avatar Jul 30 '24 05:07 kamjin3086

My project is deployed on Vercel, but the local tests are not working. I found some posts suggesting that the issue might be caused by the host network environment, but I don't know how to fix it. #3920

OKHand-Zy avatar Jul 30 '24 06:07 OKHand-Zy

My project is deployed on Vercel, but the local tests are not working. I found some posts suggesting that the issue might be caused by the host network environment, but I don't know how to fix it. #3920

After I read your link, this problem has been solved. Now google provider works normally on localhost:3000, the reason is indeed network problems. I think it is necessary to ensure that node can access Google server normally. I used clash for windows TUN mode and it worked fine, you can try it too.

kamjin3086 avatar Jul 30 '24 07:07 kamjin3086

This is what I get. Is there any way we can show more information like the original request to & response from google?

[auth][error] TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11730:11)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)
    at getAuthorizationUrl (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/signin/authorization-url.js:24:35)
    at Module.signIn (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/signin/index.js:16:56)
    at AuthInternal (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/index.js:72:24)
    at Auth (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/index.js:126:34)
    at /path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:207:37
    at e_.execute (/path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:122:26)
    at e_.handle (/path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:269:30)
    at doRender (/path/to/my-saas-project/node_modules/next/src/server/base-server.ts:2273:30)
image /

And I believe I'm doing everything as the docs describes https://next-auth.js.org/providers/google

  '@auth/[email protected]':
    resolution: {integrity: sha512-UKk3psvA1cRbk4/c9CkpWB8mdWrkKvzw0DmEYRsWolUQytQ2cRqx+hYuV6ZCsngw/xbj9hpmkZmAZEyq2g4fMg==}

Authorized JavaScript origins

http://localhost:3000
http://localhost

Authorized redirect URIs

http://localhost:3000/api/auth/callback/google
http://localhost/api/auth/callback/google
http://localhost:3000
http://localhost
export default {
  debug: true, 
  providers: [
    Google({
      clientId: env.GOOGLE_CLIENT_ID,
      clientSecret: env.GOOGLE_CLIENT_SECRET,
    }),
...

I'm getting same error. did you solve it?

mdhaiderhossain avatar Aug 03 '24 09:08 mdhaiderhossain

I also got the same error but then I followed this video and things worked out perfectly. Hope it helps.

This video uses pure react without next.js or next-auth. So you abandoned next-auth? @ShlokBharadwaj

I used next.js with next auth and didn't face any issues. The project is still running perfectly on my local machine and the hosted platform.

ShlokBharadwaj avatar Aug 08 '24 13:08 ShlokBharadwaj

This is what I get. Is there any way we can show more information like the original request to & response from google?

[auth][error] TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11730:11)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)
    at getAuthorizationUrl (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/signin/authorization-url.js:24:35)
    at Module.signIn (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/signin/index.js:16:56)
    at AuthInternal (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/index.js:72:24)
    at Auth (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/index.js:126:34)
    at /path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:207:37
    at e_.execute (/path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:122:26)
    at e_.handle (/path/to/my-saas-project/node_modules/next/dist/compiled/next-server/webpack:/next/dist/esm/server/future/route-modules/app-route/module.js:269:30)
    at doRender (/path/to/my-saas-project/node_modules/next/src/server/base-server.ts:2273:30)
image /

And I believe I'm doing everything as the docs describes https://next-auth.js.org/providers/google

  '@auth/[email protected]':
    resolution: {integrity: sha512-UKk3psvA1cRbk4/c9CkpWB8mdWrkKvzw0DmEYRsWolUQytQ2cRqx+hYuV6ZCsngw/xbj9hpmkZmAZEyq2g4fMg==}

Authorized JavaScript origins

http://localhost:3000
http://localhost

Authorized redirect URIs

http://localhost:3000/api/auth/callback/google
http://localhost/api/auth/callback/google
http://localhost:3000
http://localhost
export default {
  debug: true, 
  providers: [
    Google({
      clientId: env.GOOGLE_CLIENT_ID,
      clientSecret: env.GOOGLE_CLIENT_SECRET,
    }),
...

Has anyone solved this issue? I'm encountering it with IdentityServer v5 and Duende IdentityServer 6.

CodeWizardHemant avatar Nov 11 '24 12:11 CodeWizardHemant

I have spent hours figuring out what was wrong and all it took to work is changing the network. That was funny and frustrating at the same time.

IIvexII avatar Nov 12 '24 10:11 IIvexII

I have the same problem, please help me, Локальный хост Works on dev environment no,

VruyrSaribekyan avatar Nov 18 '24 14:11 VruyrSaribekyan

I'm seeing a similar issue with a custom oauth provider (teachable). I think the issue is related to a DNS issue as noted here. I'm running on Windows using WSL (Linux on windows). In my cause I see this issue intermittently and almost always after sleeping and starting a new day. I'm going to try restarting wsl when this happens next now that I have this info.

I think a quick test would be to ping <oauth-host> on the environment you're running to see if you're getting proper DNS resolution.

Error log
 POST /api/auth/signin/teachable 302 in 39ms
[auth][error] CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerror
[auth][cause]: TypeError: fetch failed
    at node:internal/deps/undici/undici:13178:13
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async tokenEndpointRequest (/home/agentsmith/Workspace/krown-website/.next/server/chunks/node_modules__pnpm_142a73._.js:2206:22)
    at async handleOAuth (/home/agentsmith/Workspace/krown-website/.next/server/chunks/c1962_@auth_core_d40425._.js:3293:29)
    at async Module.callback (/home/agentsmith/Workspace/krown-website/.next/server/chunks/c1962_@auth_core_d40425._.js:3782:41)
    at async AuthInternal (/home/agentsmith/Workspace/krown-website/.next/server/chunks/c1962_@auth_core_d40425._.js:4859:24)
    at async Auth (/home/agentsmith/Workspace/krown-website/.next/server/chunks/c1962_@auth_core_d40425._.js:5120:34)
    at async AppRouteRouteModule.do (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:10:32804)
    at async AppRouteRouteModule.handle (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:10:39698)
    at async doRender (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1452:42)
    at async responseGenerator (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1813:28)
    at async DevServer.renderToResponseWithComponentsImpl (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1823:28)
    at async DevServer.renderPageComponent (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:2250:24)
    at async DevServer.renderToResponseImpl (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:2288:32)
    at async DevServer.pipeImpl (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:959:25)
    at async NextNodeServer.handleCatchallRenderRequest (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/next-server.js:281:17)
    at async DevServer.handleRequestImpl (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:853:17)
    at async /home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/dev/next-dev-server.js:371:20
    at async Span.traceAsyncFn (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/trace/trace.js:153:20)
    at async DevServer.handleRequest (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/dev/next-dev-server.js:368:24)
    at async invokeRender (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:230:21)
    at async handleRequest (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:408:24)
    at async requestHandlerImpl (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:432:13)
    at async Server.requestListener (/home/agentsmith/Workspace/krown-website/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/lib/start-server.js:146:13)
[auth][details]: {
  "errno": -3001,
  "code": "EAI_AGAIN",
  "syscall": "getaddrinfo",
  "hostname": "developers.teachable.com",
  "provider": "teachable"
}

ralphsmith80 avatar Jan 07 '25 15:01 ralphsmith80

next-auth-example.vercel.app works normally with v5.0.0-beta.25, can you try upgrade? Reading from this issue, and some comments above - seems like this is a network issue and is not related to next-auth.

ThangHuuVu avatar Jan 12 '25 07:01 ThangHuuVu

The problem is vpn setting my system:windows

I Slove the problem by: ① install and use clash for windows ②How to migrate your VPN to Clash? You ask POE about how to migrate your VPN configuration to Clash. like it ,successed it.

Image

③setting clash rules Image

④Launch Clash as administrator open every time ⑤Just restart your browser.Success for it.

sophie-shen3190 avatar Jan 22 '25 06:01 sophie-shen3190

Someone help me I have the same problem

programfive avatar Jan 25 '25 12:01 programfive

@sophie-shen3190 Thanks for your solution. It worked really well for me.

I am a Mac user so I gave up on "ClashX" and downloaded "Clash Verge" to enable the TUN mode. Here is the setting

Image

Then I had to launch the app with sudo in terminal

Image

Then, restart my browser.

Now I can have the google nextauth work on my local environment.

Google settings FYI:

Image

haiyunx avatar Feb 07 '25 14:02 haiyunx

找了一圈终于找到这里了,TUN mode 直接解决问题。妈的,搞了一下午。

法克 GFW

Cygra avatar Feb 13 '25 06:02 Cygra

Same error!Two weeks.TUN mode!Hope auth.js help Chinese coder. Image

CN vpn TUN mode! Image

guifeel avatar Apr 22 '25 12:04 guifeel

same error, TUN mode safe my life. WTF

0xRichBot avatar May 10 '25 16:05 0xRichBot