Auth0 does not work with Next.js app router

[alexstroescu]

Hi!
I got a problem with implementing Auth0 using the new Next.js App router. The sample app is on the old version of the router and there are no tutorials for the new version, so I tried finding my own way.
I did all the configuration from the Getting Started section on next JS, made my .env file, and this is how I made my file structure:

The page.tsx from the [auth] folder, which is the wild card route, is the basic handleAuth file.
When I go to http://localhost:3000/api/auth/login I get this error:

What can I do to make this work with the newest Next.js version?

[nadun]

Hi Alex,

I have the same issue. Have you found a solution?

Attached is my screenshot of the file structure and I am using the latest NEXTJS build.

[WSzP]

I have the same issue, and found no workaround. Using Next.js 13.4

[cool4uh]

I’ve tried multiple times to test an app router, but I’ve had no luck.

[ku6ryo]

Hi,
I faced the same problem.
Even in a project that is using App Router, legacy “pages/api” directory works.

Example code

GitHub - ku6ryo/Auth0_NextJs-AppRouter

Please try creating a route in the API directory.

ku6ryo/Auth0_NextJs-AppRouter/blob/master/src/pages/api/auth/[...auth0].ts

[Adnanear]

(post deleted by author)

[Adnanear]

I’m facing the same issue… I tried to mock the api route like the following: const auth = handleAuth({ ... }); export default auth; export { auth as GET, auth as POST };
But that didn’t solve the issue.

I ended up by creating src/pages/api/auth/[...auth0].ts and using it just like the current documentation says until they update the package to support the new NextJs App Router