How to use nextAuth's [...nextauth] dynamic route in the new version next js 13.2 app dir api route?

Question

Currently, the […nextauth].ts file in the pages/api/auth directory is working properly. However, I want to migrate to Next.js 13.2’s app directory API route but can’t find a way to migrate my nextAuth route. I have tried moving /pages/api/auth/[…nextauth].ts to app/api/auth/[…nextauth].ts but it’s not working.

Kaine

Answer 1

The next-auth documentation recommends the following approach for Next 13.2+

/app/api/auth/[...nextauth]/route.ts <- file strucure

import NextAuth from "next-auth"

const handler = NextAuth({
  ...
})

export { handler as GET, handler as POST }

Wile

Answer 2

API Routes

API Routes continue to work in the pages/api directory without any changes. However, they have been replaced by Route Handlers in the app directory.

So this is the new structure : /app/api/auth/[...nextauth]/route.js

Precocity

Answer 3

Currently, this isn't possible. Reason being that Route Handlers specifically exports only HTTP Methods, NextAuth method is a custom wrapper/handler which takes NextApiRequest and NextApiResponse, modify them with your AuthOptions to establish authorization flow. So if you stick with Next-Auth, you should still use pages directory.

Edit #1: Found Merge PR for this feature and it's seems to be actively worked on. Follow Issue and Merge PR for more info.

Keep in mind many features of Next 13 are still experimental and are not recommended for production.

I believe it will take quite a while until valid solution is found, as Next-Auth is currently being reworked in to Auth.js and Vercel just changes things way too fast for anyone to make major updates to libraries. Also the fact that many of these features are still experimental, so we are yet to see what stays part of the framework.

Gosport

Answer 4

In my case I tried typing out "[...nextauth]" in the editor as earlier I copied "[...nextauth]" from a blog page I was following. something to do with characters I think. after typing out works fine.

Kristalkristan