Search code examples
next.jsoauthgoogle-oauthnext-auth

next auth login not working with Next.Js 13

I've recently created a Next.Js (13.4.19) app and to manage the authnetication system I've used next-auth (4.23.1). I've followed this tutorial (https://www.youtube.com/watch?v=w2h54xz6Ndw&t=2054s) and did all the things to setup my auth system using only providers (GitHub and Google).

The problem occurs when I try to login: the app sends me to the correct signin route (api/auth/signin) and when I click on the buttons nothing happens; the page refreshes itself, but no errors in the console.

Here's my code:

app/api/auth/[...nextauth]/route.ts

import NextAuth from 'next-auth/next';
import { options } from '@/app/utils/options';

const handler = NextAuth(options);

export { handler as GET, handler as POST };

app/utils/options.ts

import type { NextAuthOptions } from 'next-auth';
import { validateCredentials } from './helpers/getCredentials';

import GoogleProvider from 'next-auth/providers/google';
import GithubProvider from 'next-auth/providers/github';
import DiscordProvider from 'next-auth/providers/discord';

const googleCredentials = validateCredentials(
  process.env.GOOGLE_CLIENT_ID!,
  process.env.GOOGLE_CLIENT_SECRET!
);

const githubCredentials = validateCredentials(
  process.env.GITHUB_CLIENT_ID!,
  process.env.GITHUB_CLIENT_SECRET!
);

export const options: NextAuthOptions = {
  providers: [
    GoogleProvider({
      clientId: googleCredentials.clientId,
      clientSecret: googleCredentials.clientSecret,
    }),
    GithubProvider({
      clientId: githubCredentials.clientId,
      clientSecret: githubCredentials.clientSecret,
    }),
  ],
};

Here are the settings of the GitHub OAuth app I've created

I've tried watching other possible solutions on youtube and github, but nothing works. Every time I try to login nothing happens. For example, if I click on the GitHub button, it should redirect me to the github login page; instead, the current page refreshes and nothing happens.

Solution

  • I found this https://github.com/nextauthjs/next-auth/discussions/7785 and after upgrading my Node version from 18 to 20, the problem disappeared.