Hi all, I am building a nextjs (w
Hi all, I am building a nextjs (w typescript) project with convex auth and am implementing email/password signin-up flows. All is working well including creating users in the tables , sending verification codes via mail(resend), inputting them and getting them registered on convex tables. I have got a lot of flows to implement still. My question is I have app router and for instance I have /signup and /verify routes . When I router.push to /verify page after a successful registration of account then convex auth doesn't have access to user so verify route can't couple the code with user. What is the correct redirection method so that signup > enter verification code > totheprivateroute flow can be realized?
8 Replies
This should just work, what are you seeing?
I see that I am not authenticated. For instance If I check via
const user = useQuery(api.auth.isAuthenticated) on verify route then it returns false. I was expecting it to return true though.
If I modify ConvexClientProvider to see if it is active on the page I see it is.
Could it be something to do with Cookie setup? I am a bit lost.
Could it be something to do with Cookie setup? I am a bit lost.
What you're describing does work, so this is a matter of debugging your setup.
Is your verify page a server or client component? If it's server then you have to make sure you have the "Next.js app router with SSA" steps completed here (be sure to select Next.js and then "App Router with SSA"): https://labs.convex.dev/auth/setup#set-up-the-react-provider
it is a client component. I am sure I messed it up somewhere (most probably in middleware) since I have a dynamic language setup on the router which makes it harder to debug things. I will update you regardless for the progress. Thank you @erquhart
So , when I log in with an existing user then I receive
22/05/2025, 15:36:40 [CONVEX M(auth:store)] [INFO] '
auth:store type: createVerificationCode'
I then receive a verificationCode .
And authSessions table is still empty at this moment. So I believe I first need to input verificationCode so that user becomes verified and I hope then he/she will become isAuthenticated. @erquhart
So my problem is , how can I make it possible to associate the user with verification code entry?
I can do this manually by creating a context providing email and the code or simply by adding a link to the email so once the link is clicked then this information is sent to verification.ts for instance.
But am I supposed to do it manually really? Or am I missing something else?
And If I remove
reset: ResendOTPPasswordReset,
verify: ResendOTP,
from auth.ts then immediately I started getting
22/05/2025, 16:11:30 [CONVEX M(auth:store)] [INFO] 'auth:store type: retrieveAccountWithCredentials'
22/05/2025, 16:11:30 [CONVEX M(auth:store)] [INFO] 'auth:store type: signIn'
22/05/2025, 16:11:31 [CONVEX M(auth:store)] [INFO] 'auth:store type: refreshSession'
and I am getting authSessions document just fine.
So indeed without verification authSession document is not created which means user can not be authenticated without first verificationToken is submit.
In that case I have to really manualy keep the email information , redirect after signup to verify route with email info with normal context api and submit email and expect the code via input and submit . This is fineYou wouldn't have a session, you would have records in
authAccounts and authVerificationCodes: https://github.com/get-convex/convex-auth/blob/e4a9e0e7de0da9160185ac0028cfb684a9bcd147/src/server/implementation/mutations/createVerificationCode.ts#L21-L72
The verification code is verified by looking up the code itself: https://github.com/get-convex/convex-auth/blob/e4a9e0e7de0da9160185ac0028cfb684a9bcd147/src/server/implementation/mutations/verifyCodeAndSignIn.ts#L97-L194hmm then my current verification code is not hitting it right. I will check this now. What you mean is I dont have to provide an email for a lookup in correspondence with code right=
because now that I removed email authentication everything works flawless, I have user info and the session and the document in the table all created.
The email and code both being in the form submission (or mutation however you're calling it) is standard: https://labs.convex.dev/auth/config/otps#add-sign-in-form
OTPs - Convex Auth
Authentication library for your Convex backend
I realized I was using the wrong flow. I was supposed to use
<input name="flow" type="hidden" value="email-verification" />