NextJS + Vercel Application: api/auth/callback failing despite succeeding locally

Hey Auth0 team!

I’ve been banging my head against the wall in search of a solution to an issue I’m having getting the callbacks to to work in production after login and logout. It seems that both the login and logout functions are working in both environments but on redirect I’m consistently getting an error in production. Some context first on what I’ve tried:

I have an application built with NextJS that uses the Auth0 SDK for user registration and login. It’s been working well locally and has historically worked well upon deployment to Vercel. Today, it stopped working in “production” on Vercel. I’ve done the following to troubleshoot but can’t quite track down the root cause:

  1. Moved all of my production environment variables into Vercel. This is what my .env.production file in my repo looks like currently.
AUTH0_SECRET=${AUTH0_SECRET}
AUTH0_BASE_URL=${AUTH0_BASE_URL}
AUTH0_ISSUER_BASE_URL='https://dev-34dtsap5c884eh3q.us.auth0.com'
AUTH0_CLIENT_ID=${AUTH0_CLIENT_ID}
AUTH0_CLIENT_SECRET=${AUTH0_CLIENT_SECRET}
  1. Created a separate Auth0 application for the Vercel environment. With the following Application URIs:

Here is the Auth0 file for reference:

/src/pages/api/auth/[…auth0].js

import { handleAuth, handleLogin } from '@auth0/nextjs-auth0';

export default handleAuth({
  onError(req, res, error) {
    console.log(error);
    console.log(req)
    res.status(error.status || 500).end('Check the console for the error');
  }
});

I’m sure there’s a straightforward reason - but I haven’t found it yet in my attempts to fix and in the other articles with similar subjects. If there’s any guidance on troubleshooting on my own further, please let me know. Otherwise, any guidance on a potential root cause would help!

Thanks

Hello there!

I’m facing the same issue, it seems to be coming out of nowhere.
One thing that is odd tho’ is that we have a staging environment that shares the same Auth0’s configuration and for which everything works just fine.

So it might be an environment based issue.

Update !
I’ve updated the NPM Packages and it works!

From :

  • “auth0”: “^3.0.1”
  • @auth0/nextjs-auth0”: “^2.0.1”

To :

  • “auth0”: “^3.2.0”
  • @auth0/nextjs-auth0”: “^2.2.1”
1 Like

Hey! Awesome; thanks so much for the response. Uninstalling both packages and re-installing them did the trick.

Thanks again!

1 Like

Thanks everyone for sharing it with the rest of community!

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.

Hey team!

This topic seems related to the new Auth0 Integration available new in Vercel Marketplace. This is the first version of this integration, and we welcome your feedback to improve future iterations.

You’ll need an existing Vercel project to use the new integration to build and customize the Identity flow. You can either import your project into Vercel or use a Vercel template so you don’t have to start from scratch like our SaaStart template to deploy a production-ready B2B SaaS app in minutes (learn more here).

If you find yourself having questions regarding this new integration for the next two weeks, we are hosting an Ask Me Anything session. Our Product Expert will provide comprehensive written answers on August 8th from 8 AM to 10 AM PST.

Find out more about Auth0 Integration and learn more about AMA.

Thanks!
Dawid