nextauth (V5) - PKCE code_verifier cookie was missing
Unanswered
Siamese posted this in #help-forum
SiameseOP
anyone knows how to fix this error? Using discord provider
[auth][error] InvalidCheck: PKCE code_verifier cookie was missing.. Read more at https://errors.authjs.dev#invalidcheck
[auth][error] InvalidCheck: PKCE code_verifier cookie was missing.. Read more at https://errors.authjs.dev#invalidcheck
13 Replies
SiameseOP
please ping if reply
Asian black bear
To ensure you get the best possible assistance, could you please change your thread title to be more descriptive? Specific titles attract the attention of users who can help and make it easier for others to find similar solutions in the future.
SiameseOP
I'm running beta 15, will look into upgrading to beta 19
Sun bear
Did you run a signIn function from a client component?
Like in the docs this has to be a server conponent:
But super wild guess is you declared this as client component 😅 If you have more info please write it.
Like when exactly happens what and maybe you can share parts of the code
Like in the docs this has to be a server conponent:
import { signIn } from "@/auth"
export function SignIn() {
return (
<form
action={async () => {
"use server"
await signIn("google")
}}
>
<button type="submit">Signin with Google</button>
</form>
)
} But super wild guess is you declared this as client component 😅 If you have more info please write it.
Like when exactly happens what and maybe you can share parts of the code
@Sun bear Did you run a signIn function from a client component?
Like in the docs this has to be a server conponent:
js
import { signIn } from "@/auth"
export function SignIn() {
return (
<form
action={async () => {
"use server"
await signIn("google")
}}
>
<button type="submit">Signin with Google</button>
</form>
)
}
But super wild guess is you declared this as client component 😅 If you have more info please write it.
Like when exactly happens what and maybe you can share parts of the code
SiameseOP
I have a util file in which I import the signIn function and then import that util file on a "use client" page
Could this be the issue?
@Siamese I have a util file in which I import the signIn function and then import that util file on a "use client" page
Sun bear
Maybe yes. I would try to copy paste the code from the docs 1:1 from my prev message into an own page like login-test.
If the is not working then you have a problem.
I had the same problem and i figured out that when the signin was not triggert from a server component there were cookie issues
If the is not working then you have a problem.
I had the same problem and i figured out that when the signin was not triggert from a server component there were cookie issues
@Sun bear Maybe yes. I would try to copy paste the code from the docs 1:1 from my prev message into an own page like login-test.
If the is not working then you have a problem.
I had the same problem and i figured out that when the signin was not triggert from a server component there were cookie issues
SiameseOP
I have a button with an onClick function though
I don't use any forms
this will add extra steps for the user since with login button they would be redirected to a login page
@Siamese this will add extra steps for the user since with login button they would be redirected to a login page
Sun bear
This is more or less just a button. There is no visible form
But got your point. For me troubleshooting comes just often to the point to follow along the docs again 1:1 until its working and when its working you can try to adjust things imo
import { signIn } from "@/auth"
export function SignIn() {
return (
<form
action={async () => {
"use server"
await signIn("google")
}}
>
<button type="submit">Signin with Google</button>
</form>
)
} But got your point. For me troubleshooting comes just often to the point to follow along the docs again 1:1 until its working and when its working you can try to adjust things imo
SiameseOP
maybe I will try to switch back to the signIn function from the next-auth/react package