Next auth credentials authentication

[shemaikuzwe]

Environment

Paste here

System:
OS: Windows 11 10.0.22631
CPU: (4) x64 Intel(R) Core(TM) i5-4300U CPU @ 1.90GHz
Memory: 1.17 GB / 7.90 GB
Binaries:
Node: 20.16.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.22 - ~\AppData\Roaming\npm\yarn.CMD
npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD
pnpm: 9.11.0 - ~\AppData\Local\pnpm\pnpm.CMD
Browsers:
Edge: Chromium (127.0.2651.98)
Internet Explorer: 11.0.22621.3527
npmPackages:
@auth/firebase-adapter: ^2.5.3 => 2.5.3
next: 14.2.13 => 14.2.13
next-auth: ^5.0.0-beta.22 => 5.0.0-beta.22
react: ^18 => 18.3.1

Reproduction URL

https://github.com/Ikuzweshema/next-auth-example

Describe the issue

Next js credentials authentication when a user loggs in with email and password user is redirected but the session remains null and url does not change until you refresh the page do you also face that error??.i dont know if it is for me only or you also face that issue.

How to reproduce

i think client components do not get the session when we redirect back and the url does not update so i think you can fix this issue

Expected behavior

As like other providers like google the session should be working as expected and also url should change.

[MeerArsalanAli27]

To fix the issue with Next.js credentials authentication, where the session stays null and the URL doesn't update after login, first ensure you're using useSession() correctly for session updates. When calling signIn, set redirect: false and manually handle the redirect with router.push(). Also, double-check your credentials provider setup in nextauth.js to make sure everything is configured properly. You can enable debugging to get more insight into the problem.

If you're still facing the issue after trying these steps, feel free to provide me with the codebase, and I'll take a closer look!

[Imunal]

Your problem it's related to known issue.

Take a look at #9504

[shemaikuzwe]

export async function authenticate(
_prevState: Result | undefined,
formData: FormData
): Promise<Result | undefined> {
try {
const email = formData.get('email')
const password = formData.get('password')

const parsedCredentials = z
  .object({
    email: z.string().email(),
    password: z.string().min(6)
  })
  .safeParse({
    email,
    password
  })

if (parsedCredentials.success) {
  await signIn('credentials', {
    email,
    password,
    redirect: false
  })

  return {
    type: 'success',
    resultCode: ResultCode.UserLoggedIn
  }
} else {
  return {
    type: 'error',
    resultCode: ResultCode.InvalidCredentials
  }
}

} catch (error) {
if (error instanceof AuthError) {
switch (error.type) {
case 'CredentialsSignin':
return {
type: 'error',
resultCode: ResultCode.InvalidCredentials
}
default:
return {
type: 'error',
resultCode: ResultCode.UnknownError
}
}
}
}
I have put redirect:false and use router.push() const router = useRouter()
const [result, dispatch] = useFormState(authenticate, undefined)

useEffect(() => {
if (result) {
if (result.type === 'error') {
toast.error(getMessageFromCode(result.resultCode))
} else {
toast.success(getMessageFromCode(result.resultCode))
router.refresh()
}
}
}, [result, router])

and still error is still there it seems like client componets useSession do get session and url tittle updates but actual url does not update

[shemaikuzwe]

minimized