next-auth: [next-auth][error][INVALID_CALLBACK_URL_ERROR]

Question 💬

Hi, I’m getting this when running on dev/localhost:

[next-auth][error][INVALID_CALLBACK_URL_ERROR] 
https://next-auth.js.org/errors#invalid_callback_url_error Invalid callback URL. Received: http://localhost:3000http://localhost:3000 InvalidCallbackUrl: Invalid callback URL. Received: http://localhost:3000http://localhost:3000
    at assertConfig (/Users/ryanbrycekeswick/minerva/frontend/node_modules/next-auth/core/lib/assert.js:62:12)
    at NextAuthHandler (/Users/ryanbrycekeswick/minerva/frontend/node_modules/next-auth/core/index.js:70:52)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async NextAuthNextHandler (/Users/ryanbrycekeswick/minerva/frontend/node_modules/next-auth/next/index.js:23:19)
    at async /Users/ryanbrycekeswick/minerva/frontend/node_modules/next-auth/next/index.js:59:32
    at async Object.apiResolver (/Users/ryanbrycekeswick/minerva/frontend/node_modules/next/dist/server/api-utils/node.js:179:9)
    at async DevServer.runApi (/Users/ryanbrycekeswick/minerva/frontend/node_modules/next/dist/server/next-server.js:381:9)
    at async Object.fn (/Users/ryanbrycekeswick/minerva/frontend/node_modules/next/dist/server/base-server.js:488:37)
    at async Router.execute (/Users/ryanbrycekeswick/minerva/frontend/node_modules/next/dist/server/router.js:213:36) {
  code: 'INVALID_CALLBACK_URL_ERROR'
}

I’m specifically using AWS Cognito only with usernames/passwords. I have set the clientId, clientSecret and Issuer

I have set the env vars correctly

COGNITO_CLIENT_ID=********************
COGNITO_CLIENT_SECRET=****************************************
COGNITO_ISSUER=https://cognito-idp.${region}.amazonaws.com/${userPoolId)

NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=********************

How to reproduce ☕️

pages/api/auth/[...nextauth].ts

import NextAuth from 'next-auth';
import CognitoProvider from 'next-auth/providers/cognito';
import { PrismaAdapter } from '@next-auth/prisma-adapter';
import prisma from '@/lib/prismadb';

export const authOptions = {
  adapter: PrismaAdapter(prisma),
  providers: [
    CognitoProvider({
      clientId: String(process.env.COGNITO_CLIENT_ID),
      clientSecret: String(process.env.COGNITO_CLIENT_SECRET),
      issuer: process.env.COGNITO_ISSUER,
    }),
  ],
  callbacks: {
    async session({ session, user }: any) {
      session.user.id = user.id;
      return session;
    },
  },
};

export default NextAuth(authOptions);

Sign in button

<button
            className="m-5 grid h-10 w-24 place-content-center rounded-full hover:bg-dark-blue hover:text-white"
            onClick={() => signIn('cognito')}
          >
            Sign in
</button>

Contributing 🙌🏽

No, I am afraid I cannot help regarding this