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:
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