Next Auth error: 405 (Method Not Allowed)

Questions and Answers
1
System Information
  • Strapi Version: v4
  • Operating System:
  • Database:
  • Node Version: 16.16.0
  • NPM Version: 8.15.0

I have a problem with Next Auth, it gives me an error:

POST http://localhost:1338/api/callback/credentials 405 (Method Not Allowed)

pages/api/auth/[…nextauth].js

import NextAuth from "next-auth";
import CredentialsProvider from "next-auth/providers/credentials";

export default NextAuth({
    theme: {
        colorScheme: 'light',
    },
    debug: true,
    session: {
        strategy: 'jwt',
    },
    jwt: {
        secret: 'secret',
    },
    providers: [
        CredentialsProvider({
            //id: 'email-login',
            name: 'Credentials',
            credentials: {
                identifier: { label: "email", type: "text", placeholder: "email" },
                password: { label: "password", type: "password", placeholder: "password" },
            },
            async authorize({ credentials, req }) {
                const res = await fetch(`${process.env.apiPublicUrl}/auth/local`, {
                    method: 'POST',
                    body: JSON.stringify(credentials),
                    headers: {
                        'Content-Type': 'application/json',
                    }
                })
                const user = await res.json()

                if (res.ok && user) {
                    return user
                }
                return null
            }
        }),
    ],
    secret: process.env.NEXTAUTH_SECRET,

    callbacks: {

        async session({ session, user }) {
            session.jwt = user.jwt;
            session.id = user.id;
            return session;
        },
        async jwt ({ token, user, account }) {
            if (user) {
                const response = await fetch(`${process.env.apiPublicUrl}/auth/${account.provider}/callback?access_token=${account?.accessToken}`);
                const data = await response.json();
                token.jwt = data.jwt;
                token.id = data.user.id;
            }
            return token;
        },
    },
    pages: {
        //signIn: '/login',
    }
})
1 Like
2

Check that you have permissions.
405 normally means your not allowed to send a POST request to that endpoint, could it be without ending / :thinking:

4

To fix 405 errors, you need to check your server-side logs. At times, a web app keeps server-side logs to track the activities and events that happen on your site. Making changes in the server logs can be why the 405 Method Not Allowed message is showing on your website. You can check your server logs to ensure all information is correct. To gain access to a site’s server logs, head to your root directory and look for the access.log and error.log files. See, in case any of the information there looks out of place. Another method that can be applied is to fix file ownership. Just go to hPanel and press on Fix File Ownership under Other. From here, you can tick the option that you like to set your site’s files and folders to default permissions and press the option that says Execute.

5

Looks like NextAuth has an issue with NextJS14 and SRC project instead of Pages.
Deleting and recreating […nextauth] did not work, and probably I would be worried if it did…

What happened in my case was that I had to encapsulate the NextAuth into the proper requests.

Step 1 :
route.js

const myNextAuthOptions = {} // Your options here…

export async function GET( req,res ) {
return NextAuth(req,res,MyNextAuthOption)
}

export async function POST( req,res ) {
return NextAuth(req,res,MyNextAuthOption)
}

New Error :
Yay, you are almost there. In my case NextJS gave me a different error, complaining that
my ./core/routes were not exported on the package.json from NextAuth…

Step 2 :
edit node_modules/next-auth/package.json
Add :
“./core/routes”: {
“types”: “./core/routes/.d.ts",
“default”: "./core/routes/.js”
}
to “exports”

This fixed for me. Hope it could help you.