Next auth redirects to callback without logging in when clicking signIn function

13 Views Asked by At

Next auth redirects to callback without logging in when clicking signIn function:

I'm using a nextjs app with nextauth to authenticate on Google.

import { useSession, signIn, signOut, SessionProvider } from 'next-auth/react';
import { ReactElement, MouseEvent } from 'react';

export default function LoginPage(): ReactElement {
  const { data: session } = useSession();

  const handleSignOut = (event: MouseEvent<HTMLButtonElement>): void => {
    event.preventDefault();
    signOut();
  };

  const handleSignIn = (event: MouseEvent<HTMLButtonElement>): void => {
    event.preventDefault();
    console.log('SignIn button clicked'); // Verifique se a função está sendo chamada
    signIn();
  };

  if (session) {
    return (
      <>
        Signed in as {session.user?.email} <br />
        <button onClick={handleSignOut}>Sign out</button>
      </>
    );
  }

  return (
    <>
      Not signed in <br />
      <button onClick={handleSignIn}>Sign in</button>
    </>
  );
}

Error:

enter image description here

route.ts in [...nextauth]

import NextAuth, { AuthOptions } from 'next-auth';
import GoogleProvider from 'next-auth/providers/google';

export const authOptions: AuthOptions = {
  providers: [
      GoogleProvider({
          clientId: process.env.GOOGLE_ClIENT_ID as string,
          clientSecret: process.env.GOOGLE_CLIENT_SECRET as string
      })
  ],

  pages: {
      signIn: '/login',
  },
  debug: process.env.NODE_ENV === 'development',
  session: {
      strategy: 'jwt'
  },
  secret: process.env.NEXTAUTH_SECRET
 
}


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

What would be the problem opening Google?

nextauth in version 4.x

0

There are 0 best solutions below