Next 13.2 - App directory now with route handlers

[sFritsch09]

When using the app dir in Next 13.2 and higher we shouldn't use pages directory anymore and next-auth to app dir too for better performance!

Check out here: Route handlers

current structure: /pages/api/auth/[...nextauth].js

new structure: /app/api/auth/[...nextauth]/route.js

[fachrur95]

I have issue for this change. I've got error /api/auth/session 405 code error (Method Not Allowed) and Unexpected end of JSON input. Anyone have solution for this issue?

[w-dib]

I'm having the same problem. I spent about 2 hours ripping my hair apart.

Lesson learned: don't always go for npx create-next-app@latest

[trpipher]

I did see that in order to get it work, youre going to have to export the nextAuth handler as all the new options in route.ts

So maybe y'all can try

const handler = NextAuth(authoptions);
export default (handler as GET, handler as POST, etc etc)

[w-dib]

Apologies, I'm a bit of a newbie. How would I change my routse.js now?

path: api>auth>[...nextauth]>route.js

import NextAuth from "next-auth";
import GoogleProvider from "next-auth/providers/google";

export const authOptions = {
  // Configure one or more authentication providers
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_ID,
      clientSecret: process.env.GOOGLE_SECRET,
    }),
    // ...add more providers here
  ],
};

export default NextAuth(authOptions);

What am I changing exactly?

[trpipher]

I don't know that it's completely supported yet. It looks like theres a PR getting written for support this week.
You can track #6792 as well as #6777

But to answer your question it looks like it'll be shaped like this:
export default NextAuth(authOptions);
to

const hander = NextAuth(authOptions);
export {handler as GET, handler as POST};

[masterbater]

I'm having the same problem. I spent about 2 hours ripping my hair apart.

Lesson learned: don't always go for npx create-next-app@latest

Dont use beta feature thats the lesson you should learn, latest nextjs 13 is supported everywhere but not the app directory. Libraries wont add support or documentation for beta app directory. Its not worth it making workaround for it. Just use the page folder then you can just incrementally migrate to app directory once its stable