[auth][error] CallbackRouteError

[jelmd]

Environment

  System:
    OS: Linux 5.4 Ubuntu 20.04.6 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Xeon(R) CPU E3-1505M v5 @ 2.80GHz
    Memory: 49.06 GB / 62.40 GB
    Container: Yes
    Shell: 6.21.00 - /usr/bin/tcsh
  Binaries:
    Node: 20.5.1 - /usr/bin/node
    npm: 9.8.0 - /usr/bin/npm
    Watchman: 4.9.0 - /usr/bin/watchman
  npmPackages:
    next: ^15.0.0-rc.0 => 15.0.0-rc.0 
    next-auth: ^5.0.0-beta.19 => 5.0.0-beta.19 
    react: ^19.0.0-rc-512b09b2-20240718 => 19.0.0-rc-512b09b2-20240718

Reproduction URL

https://github.com/jelmd/nextjs-bugs/tree/01_auth/01_auth

Describe the issue

If a signIn fails e.g. because of a wrong password, nextAuth throws the following Error/stacktrace but does not explain, what the real problem is, or what it really expects. Documentation gives also no usable hint, what the problem is:

[auth][error] CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerror
[auth][cause]: Error
    at Module.callback (webpack-internal:///(rsc)/./node_modules/@auth/core/lib/actions/callback/index.js:226:23)
    at async AuthInternal (webpack-internal:///(rsc)/./node_modules/@auth/core/lib/index.js:66:24)
    at async Auth (webpack-internal:///(rsc)/./node_modules/@auth/core/index.js:126:34)
    at async /home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:63352
    at async eP.execute (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:54549)
    at async eP.handle (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:64693)
    at async doRender (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/base-server.js:1419:42)
    at async responseGenerator (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/base-server.js:1640:40)
    at async DevServer.renderToResponseWithComponentsImpl (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/base-server.js:1665:28)
    at async DevServer.renderPageComponent (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/base-server.js:1978:24)
    at async DevServer.renderToResponseImpl (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/base-server.js:2016:32)
    at async DevServer.pipeImpl (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/base-server.js:908:25)
    at async NextNodeServer.handleCatchallRenderRequest (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/next-server.js:273:17)
    at async DevServer.handleRequestImpl (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/base-server.js:804:17)
    at async /home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/dev/next-dev-server.js:339:20
    at async Span.traceAsyncFn (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/trace/trace.js:157:20)
    at async DevServer.handleRequest (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/dev/next-dev-server.js:336:24)
    at async invokeRender (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/lib/router-server.js:175:21)
    at async handleRequest (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/lib/router-server.js:354:24)
    at async requestHandlerImpl (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/lib/router-server.js:378:13)
    at async Server.requestListener (/home/elkner/work/nextjs-bugs/01_auth/node_modules/next/dist/server/lib/start-server.js:142:13)
[auth][details]: {
  "provider": "sha512"
}
 POST /api/auth/callback/sha512 302 in 57ms
 GET /api/auth/error?error=Configuration 500 in 10ms

How to reproduce

git clone https://github.com/jelmd/nextjs-bugs.git
git co 01_auth
cd 01_auth
# follow README.md to install node moules and init the MySQL test DB and finally:
npm run dev

firefox http://localhost:3000

# Klick on Login
# Username: john
# password: bla

# Now it throws the Error

Expected behavior

Worked flawless in pages route with next-auth 4.x - so it should with app router and next-auth 5.x.

[Pierozi]

version beta.19 has issue with lot of provider.
if you want to use v5, give a try to pnpm add -S [email protected]

related to #11074

[jelmd]

thanx @Pierozi! But it still throws an exception with [auth][error] CredentialsSignin: Read more at https://errors.authjs.dev#credentialssignin.

Actually looking at #11074 and related code reveals the real problem: Using exceptions for control flow is a miserable decision and newbie error for a long time. It is such an easy DoS vector, that it makes next-auth everything else but enterprise ready. So IMHO the bug should be tagged as security problem, too, because this way it is so easy to stop a system from working or at least hurt its performance in a significant way.

BTW: Wondering, why an exception gets thrown at all (or not caught by next-auth). Wrong passwords should be expected (could by simple typos, etc.) and thus not cause an exception but rather should be handled properly without logging any stack traces. Logging 'wrong password' would be sufficient and give the right advice to developers and app operators to not waste a lot of their valuable/expensive time troubleshooting to diagnose the problem.

Last but not least: Is there a release plan alias ETA for 5.x stable? Background: we trying to convert a pages router app with next-auth v4 to and app router app and think, it might be a good idea to switch to v5 because of the announced complete rewrite and app router first statements, so it its up-t-date/state-of-the-art when React 19/NextJS 15 stable get released (guess in 2024-10..12) and we do not re-write it again, because so much has been changed ...

[Pierozi]

I will not able to provide you more infos about the status of 5.x because it was my first experience with Next-Auth and only last a day.
I didn't like the integration with third party provider (in my case Auth0).

• The lack of proper redirection to the provider authentication and not the crappy page with all the login buttons
• The serverside authentication management and session
• We switch to the native @auth0/nextjs-auth0 and integration was done in 1h

[nehal7-ml]

having the same issue using @auth/[email protected] and @hono/[email protected],
The issue seems to be that the CredentialsSignin class extends the Error Class instead of the AuthError Class.
The function that processes callback action for credentials throws the CredentialSignin when null is received on a failed login attempt, but this is caught and as you can see below the code checks if the Error is an instance of AuthError, since CredentialSignin doesn't extend AuthError CallbackRouteError is thrown

[StaticSphere]

With all due respect, and honestly, a lot of appreciation for what you're doing here with this project, I have to agree with @jelmd. Exceptions are for exceptional situations; database is offline, API calls aren't working, etc. A user inputting invalid credentials is NOT an exceptional situation. It's completely expected. Exceptions should not be used for controlling logic flow. This code should be returning a status code, not throwing an exception.

[balazsorban44]

Fixed in #11469

[ndom91]

Quick background info, it was never supposed to be throwing an error that's not caught. I added a new error type for Custom Credential errors to extend from because our builtin AuthError always appends the text ... please check out authjs.dev/errors... to the end of error.message and that wasn't helpful when printed in user's applications. See here for more info - #10231. I just missed the this additional catching logic that looked for instanceof AuthError.

[StaticSphere]

Thanks for the update!! :)

[wcu1117]

i have the same error.i use a chinese custome oauth2.0 provider service.after scan qrcode get the error.after get the token
i use "next-auth": "^5.0.0-beta.20" in the "lobe-chat".

error message:

`
callback route error details {
method: 'GET',
query: {
code: '041Vwall2wnsZdenl2tF5RK3Vwalk',
state: 'eyJyYW5kb20iOiJJZExMUUJLazI2cGJObi1DajEtc3lRZzhMVDZWTmFWekc1cGVBIn0'
},
body: undefined
}
CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerror
at Module.callback (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/callback/index.js:382:23)
type: 'CallbackRouteError',
kind: 'error',
[cause]: {
err: TypeError: "response" must be an instance of Response
at Module.parseWwwAuthenticateChallenges (webpack-internal:///(rsc)/./node_modules/oauth4webapi/build/index.js:691:15)
at handleOAuth (webpack-internal:///(rsc)/./node_modules/next-auth/node_modules/@auth/core/lib/actions/callback/oauth/callback.js:84:65)

[NextAuth] Error: {
cause: 'Configuration',
message: 'Wrong configuration, make sure you have the correct environment variables set. Visit https://lobehub.com/docs/self-hosting/advanced/authentication for more details.',
name: 'NextAuth Error'
}`

my custome provider:

`
{

id: "wechat",
name: "微信",
type: "oauth",
clientId:clientId,
clientSecret:clientSecret,
authorization: {
url: "https://open.weixin.qq.com/connect/qrconnect",
},

token: {
  url: "https://api.weixin.qq.com/sns/oauth2/access_token",
  params: {
    appid: clientId,
    secret: clientSecret,
  },
  request: async (context: TokenContext & {
    provider: OAuthConfigInternal<TokenParams> & {
      signinUrl: string;
      callbackUrl: string;
    };
  }): Promise<TokenResult | void> => {
    console.log("333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333"    )
    const { provider } = context;
    const { url, params, conform } = provider.token;

    try {
      // 发起请求
      const response = await fetch(url, {
        method: 'POST',
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded',
        },
        body: new URLSearchParams(params),
      });

      // 直接调用 conform 函数处理响应
      const result = await conform!(response);

      if (result) {
        return result;
      }

      // 如果 conform 函数没有返回有效的结果，可以在这里处理错误
      throw new Error('Conform function did not return a valid result');
    } catch (error) {
      // 处理请求或 conform 函数中的错误
      console.error('Error during token request:', error);
      throw error;
    }
  },
  conform: async (response: Response): Promise<Response | undefined> => {
    let json = await response.json();
    console.log("222222222222222222222222response:::", json, response.ok);
    if (response.ok) {
      // 判断返回的json是否包含access_token
      if (json.access_token) {
        // 如果包含access_token，则返回json
        return { access_token: json.access_token, openid: json.openid };
      } else {
        // 抛出错误
        throw new Error(json.errmsg);
      }
    } else {
      // 抛出错误
      throw new Error("获取token失败");
    }
  },
},
userinfo: {
  url: "https://api.weixin.qq.com/sns/userinfo",
  params: {
    access_token: "{$access_token}",
    openid: "{$openid}",
    lang: "zh_CN"
  },
}
},
checks: [ "state"],

};
`