-
Notifications
You must be signed in to change notification settings - Fork 4k
Description
Environment
System:
OS: Linux 6.1 Debian GNU/Linux 12 (bookworm) 12 (bookworm)
CPU: (16) x64 Intel(R) Core(TM) i7-10700 CPU @ 2.90GHz
Memory: 34.01 GB / 46.90 GB
Container: Yes
Shell: 5.9 - /usr/bin/zsh
Binaries:
Node: 22.11.0 - ~/.nvm/versions/node/v22.11.0/bin/node
npm: 11.0.0 - ~/.nvm/versions/node/v22.11.0/bin/npm
Browsers:
Brave Browser: 134.1.76.80
Chrome: 134.0.6998.117
npmPackages:
@auth/prisma-adapter: ^2.8.0 => 2.8.0
next: 15.2.4 => 15.2.4
next-auth: ^4.24.11 => 4.24.11
react: ^19.0.0 => 19.1.0
Reproduction URL
https://github.com/ahmed-fawzy99/next-auth-fetch-error-example
Describe the issue
Using the function signIn("github") to redirect to configured GitHub OAuth does not work. It throws CLIENT_FETCH_ERROR then reloads the current page.
However, signIn() works and redirects me to NextAuth's default login page (``http://localhost:3000/api/auth/signin?callbackUrl=http%3A%2F%2Flocalhost%3A3000%2Flogin) with my provider in it, and the functionality works there. Also, passing anything to signIn other than my provider (github in this example) works as well and has the same behavior as passing nothing.
I'm on Next 15.2.4, NextAuth 4.24.11, Node 22.11
This is my configuration:
// src/app/api/auth/[...nextauth]/route.ts
import NextAuth from "next-auth"
import { db } from '@/db';
import { PrismaAdapter } from '@auth/prisma-adapter';
import { NextAuthOptions } from 'next-auth';
import GitHubProvider from "next-auth/providers/github";
const handler = NextAuth({
providers: [
GitHubProvider({
clientId: process.env.GITHUB_CLIENT_ID ?? '',
clientSecret: process.env.GITHUB_CLIENT_SECRET ?? '',
}),
],
adapter: PrismaAdapter(db),
})
export { handler as GET, handler as POST }.env.local:
GITHUB_CLIENT_ID=xxx
GITHUB_CLIENT_SECRET=xxx
NEXTAUTH_SECRET=xxx
NEXTAUTH_URL=http://localhost:3000
layout:
export default async function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
const session = await getServerSession(authOptions);
return (
<html lang="en">
<body
className="antialiased"
>
<SessionProvider session={session}>
<main>
<NavMenu />
{children}
</main>
</SessionProvider>
</body>
</html>
);
}The client component that calls signIn:
'use client';
import {Button} from "@/components/ui/button";
import {signIn} from "next-auth/react";
import {JSX} from "react";
interface LoginButtonProps {
serviceName: string;
icon: JSX.Element;
}
export default function LoginButton({ serviceName, icon }: LoginButtonProps) {
return (
<Button variant="outline" className="w-full" onClick={() => signIn('github')}>
{icon}
Login with {serviceName.charAt(0).toUpperCase() + serviceName.slice(1)}
</Button>
);
}How to reproduce
Explained in the issue description.
Expected behavior
To redirect me directly to github authentication page, not to the default NextAuth signIn page.