NextJS/auth0 - custom callback handler not working as per documented examples

Help
,
1

Hi,

I am trying to use nextjs/auth0 library. NextJs versions is 13.4.19 whereas auth0 lib version is 3.1.0.
I have got the basic authentication working. Now, what I am trying to do is as follows:
If the user’s email id is not verified I want to redirect the user to a different page - /verify-email. If the email id is verified, user should be redirected to /dashboard
I thought of using callbackHandler for this. I followed the given example however it isn’t working as expected.

My code is as follows

export const GET = handleAuth({
    callback: async (req: NextApiRequest, res: NextApiResponse) => {
        try {
           return await handleCallback(req, res, {
                afterCallback
            });
        } catch (error) {
            console.error(error);
        }
    }
})

My callback method is

const afterCallback = async (req: NextApiRequest, res: NextApiResponse, session: Session) => {
    console.log('I am getting called after callback', session)
    if (session.user) {
        // permanentRedirect('/verify-email')
        // res.status(200).redirect('/verify-email')
        console.log('user found', session.user)
    } else {
        console.log('user not found', session)
    }
        
    return session;
};

However, I am not seeing any session details here. It just prints

I am getting called after callback { returnTo: 'http://localhost:3000' }
user not found { returnTo: 'http://localhost:3000' }

I am not sure what’s going wrong here. I was expecting to see the session details. I was planning to use session.user.email_verified to perform the check.

One additional thing I am confused about is - returnTo attribute of the LoginOption that’s passed to handleLogin. As per docs, its URL to return to after login. Overrides the default in {@link BaseConfig.baseURL}.
Isn’t callbackUrl meant to be exactly that (Again as per docs - A callback URL is a URL in your application where Auth0 redirects the user after they have authenticated). I am confused between the two - when to use which and what should be their value respectively. If I don’t set returnTo I am returned to the home screen http://localhost:3000

Need some pointers here as I have been stuck on this for days now :frowning: . TIA

2

The function signature on your afterCallback is incorrect. The afterCallback doesn’t receive the response. Second argument is the session, third argument is the login state.

const afterCallback = async (req: NextApiRequest, session: Session, state: GetLoginState) => {
    console.log('I am getting called after callback', session)
    if (session.user) {
        // permanentRedirect('/verify-email')
        // res.status(200).redirect('/verify-email')
        console.log('user found', session.user)
    } else {
        console.log('user not found', session)
    }
        
    return session;
};
3

Hello @codenameredpanda!

I understand you’re trying to redirect users to different pages depending on email verification. This is possible through a post-login action. You can use the email_verified property in the user raw json or add it to app_metadata where it may be easier to access in actions.

Once you have this information available in actions you can redirect the user to a verify email page through an action using the post-login trigger

I hope this helps!

Best,
Alex