Hi!
I am using @auth0/nextjs-auth0 and trying to implement the following workflow:
- The user creates an account with email + password
- The user receives a verification email from Auth0
- Once clicked, the user is automatically logged into our Next.js app (the session is set),
and can be redirected with our Middleware to the appropriate onboarding page.
Current Implementation:
- User creates an account with email + password
- We create the user in Auth0 using our Node.js API and the Auth0 Management API
- We use a Machine to Machine application
- Currently using an access token from a CURL command for testing
- Create user with a POST request to https://{{domain}}.eu.auth0.com/api/v2/users
- User receives a verification email from Auth0
- “Redirect To” URL in the Verification Email template is set to our Next.js app API Route
- We receive search parameters as mentioned in Auth0 documentation
- Silent auth fails, and the user is redirected to the Universal login to enter credentials again
Issues:
- The automatic login part is not working as expected
- Silent authentication is failing
- Is this the correct way to handle this ?
Code for Route.ts (Redirect To URL):
import { handleAuth, handleLogin, handleProfile } from '@auth0/nextjs-auth0';
import { type NextRequest, NextResponse } from 'next/server';
export const GET = async (req: NextRequest) => {
console.log('Received request:', {
url: req.url,
method: req.method,
headers: Object.fromEntries(req.headers),
searchParams: Object.fromEntries(req.nextUrl.searchParams),
});
const searchParams = req.nextUrl.searchParams;
const success = searchParams.get('success');
const message = searchParams.get('message');
// Search Params typically include:
// {
// email: '', // Not provided ?
// supportSignUp: 'true',
// supportForgotPassword: 'true',
// message: 'Your email was verified. You can continue using the application.',
// success: 'true',
// code: 'success'
// }
if (success === 'true' && message?.includes('email was verified')) {
try {
const response = handleProfile({
refetch: true,
afterRefetch: (_req, _res, session) => {
console.log('After refetch:', session);
// This is never called
return session;
},
});
console.log('User profile fetched successfully:');
console.log(response);
// This return an function ?
} catch (error) {
console.error('Error fetching user profile:', error);
}
try {
// Email verification was successful, attempt to log the user in
await handleLogin(req as any, NextResponse as any, {
authorizationParams: {
prompt: 'none', // This tells Auth0 to attempt a silent authentication
},
returnTo: '/recruiter/dashboard',
});
// If handleLogin succeeds, it will have set the appropriate cookies and redirected
// If we reach this point, it means the silent authentication failed
console.log('Silent authentication failed, redirecting to login page');
return NextResponse.redirect(new URL('/api/auth/login', req.url));
} catch (error) {
console.error('Login error:', error);
return NextResponse.redirect(new URL('/api/auth/login', req.url));
}
}
// If not a successful email verification, redirect to login
return NextResponse.redirect(new URL('/api/auth/login', req.url));
};
// Export handleAuth for other auth routes
export const { GET: AuthHandler, POST: AuthHandlerPost } = handleAuth();
Key Points:
- handleProfile() is called but doesn’t seem to execute the afterRefetch callback
- Silent authentication with handleLogin() is attempted but fails
- The user is ultimately redirected to the login page