Next.js and auth.js, callbakrouteerror

Question

js with auth.js I'm using credentials provider and I'm getting this error when deploying app in server.

However in localhost there are no errors.

login page looks like this

'use client'

import { Label } from '@/components/ui/label'
import { Button } from '@/components/ui/button'
import * as z from 'zod'
import { useForm } from 'react-hook-form'
import { zodResolver } from '@hookform/resolvers/zod'
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form'
import { Input } from '@/components/ui/input'
import { FormError } from '@/components/utility/FormError'
import { LoginChema } from '@/schemas/LoginSchema'
import { login } from '@/actions/login'
import { useState, useTransition } from 'react'

export const LoginTab = () => {
  const [error, setError] = useState<string | undefined>('')
  const [isPending, startTransition] = useTransition()

  const form = useForm<z.infer<typeof LoginChema>>({
    resolver: zodResolver(LoginChema),
    defaultValues: {
      login: '',
      password: ''
    }
  })

  async function onSubmit(values: z.infer<typeof LoginChema>) {
    setError('')

    startTransition(() => {
      login(values).then((data) => {
        setError(data?.error)
      })
    })

  }

  return (
    <Form {...form}>
      <form onSubmit={form.handleSubmit(onSubmit)} className='flex flex-col gap-6'>
        <div className='flex w-full flex-col gap-2'>
          <Label htmlFor='login_type' className='text-base tracking-tight'>
            Login/Parolni kiriting
          </Label>
          <FormField
            control={form.control}
            name='login'
            render={({ field }) => (
              <FormItem>
                <FormLabel>Login</FormLabel>
                <FormControl>
                  <Input disabled={isPending} placeholder='login' {...field} />
                </FormControl>
                <FormMessage />
              </FormItem>
            )}
          />
          <FormField
            control={form.control}
            name='password'
            render={({ field }) => (
              <FormItem>
                <FormLabel>Parol</FormLabel>
                <FormControl>
                  <Input disabled={isPending} type='password' placeholder='parol' {...field} />
                </FormControl>
                <FormMessage />
              </FormItem>
            )}
          />
        </div>
        <FormError message={error} />
        <div className='flex w-full flex-col gap-3'>
          <Button disabled={isPending} type='submit' className='w-full bg-brandHighlight-500 text-white'>
            Kirish
          </Button>
        </div>
      </form>
    </Form>
  )
}

login action looks like this:

import Credentials from 'next-auth/providers/credentials'

import { AuthError, NextAuthConfig } from 'next-auth'
import { LoginChema } from '@/schemas/LoginSchema'

const baseURL = process.env.NEXT_PUBLIC_API_URL + '/users/login'

export default {
  providers: [
    Credentials({
      async authorize(credentials) {
        const validatedFields = LoginChema.safeParse(credentials)

        if (validatedFields.success) {
          const { login, password } = validatedFields.data

          const res = await fetch(baseURL, {
            method: 'POST',
            body: JSON.stringify({
              username: login,
              password
            }),
            headers: { 'Content-Type': 'application/json' }
          })

          if (!res.ok) {
            throw new AuthError('CredentialsSignin')
          }

          const user = await res.json()

          if (!user) return null

          return user
        }

        return null
      }
    })
  ]
} satisfies NextAuthConfig

and auth file like this:

import NextAuth from 'next-auth'
import authConfig from '@/auth.config'

export const {
  handlers: {
    GET, POST
  }, auth,
  signIn,
  signOut
} = NextAuth({
  pages: {
    signIn: 'auth/login',
    error: '/auth/error'
  },
  callbacks: {
    async session({ session, token }) {
      session.user.access_token = token.access_token
      session.user.username = token.username
      session.user.role = token.role

      return session
    },
    async jwt({ token, user }) {
      if (user) {
        token.access_token = user.access_token
        token.username = user.username
        token.role = user.role
      }

      return token
    }
  },
  session: {
    strategy: 'jwt',
    maxAge: 8 * 60 * 60
  },
  ...authConfig
})

[auth][error] CallbackRouteError: Read more at https://errors.authjs.dev#callbackrouteerror [auth][cause]: TypeError: fetch failed at node:internal/deps/undici/undici:12344:11 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async globalThis.fetch (/root/projects/shaffof-open-data/.next/server/chunks/198.js:6:55448) at async Object.authorize (/root/projects/shaffof-open-data/.next/server/app/auth/login/page.js:1:114277) at async Object.l (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:181609) at async u (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:195182) at async u (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:174759) at async o (/root/projects/shaffof-open-data/.next/server/chunks/763.js:358:58635) at async r (/root/projects/shaffof-open-data/.next/server/app/auth/login/page.js:1:11856) at async /root/projects/shaffof-open-data/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:406 [auth][details]: { "code": "CERT_HAS_EXPIRED", "provider": "credentials" } o: Read more at https://errors.authjs.dev#callbackrouteerror at Object.l (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:182434) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async u (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:195182) at async u (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:174759) at async o (/root/projects/shaffof-open-data/.next/server/chunks/763.js:358:58635) at async r (/root/projects/shaffof-open-data/.next/server/app/auth/login/page.js:1:11856) at async /root/projects/shaffof-open-data/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:406 at async rg (/root/projects/shaffof-open-data/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:15:6309) at async rz (/root/projects/shaffof-open-data/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:24709) at async doRender (/root/projects/shaffof-open-data/node_modules/next/dist/server/base-server.js:1394:30) { type: 'CallbackRouteError', kind: 'error', [cause]: { err: TypeError: fetch failed at node:internal/deps/undici/undici:12344:11 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async globalThis.fetch (/root/projects/shaffof-open-data/.next/server/chunks/198.js:6:55448) at async Object.authorize (/root/projects/shaffof-open-data/.next/server/app/auth/login/page.js:1:114277) at async Object.l (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:181609) at async u (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:195182) at async u (/root/projects/shaffof-open-data/.next/server/chunks/763.js:6:174759) at async o (/root/projects/shaffof-open-data/.next/server/chunks/763.js:358:58635) at async r (/root/projects/shaffof-open-data/.next/server/app/auth/login/page.js:1:11856) at async /root/projects/shaffof-open-data/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:406 { cause: [Error] }, code: 'CERT_HAS_EXPIRED', provider: 'credentials' }

Sanjai Ramasamy · Accepted Answer · 2024-02-09 01:40:42Z

0

Actually, the issue is from your API, If you notice your next-auth error log it complains as mentioned below, 

{ cause: [Error] }, code: 'CERT_HAS_EXPIRED', provider: 'credentials' }

To see your actual error, try to add catch block inside authorize/ activate the logger from next auth.

1.May be your server does not have a valid certificate
2.Check your AUTH_URL & API URL for the hosted server, may be mistyped

answered Feb 9, 2024 at 1:40

Sanjai Ramasamy

443 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Herman Popken · Accepted Answer · 2024-07-02 13:23:21Z

0

It seems like this is a problem with Next-auth beta version 19.

You can uninstall this version of next-auth and instal next-auth beta version 18.

You will still get an error message in the terminal, but the application should work as intended.

Install command for version 18: npm install [email protected]

This is not a solution, but just a temporary fix for your issue.

answered Jul 2, 2024 at 13:23

Herman Popken

1

Collectives™ on Stack Overflow

Next.js and auth.js, callbakrouteerror

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related