net::ERR_TOO_MANY_REDIRECTS [next-auth][error][CLIENT_FETCH_ERROR]

[lukaszbeben]

I use a trpc with prisma and getServerSession from 'next-auth' for authorization. I've got this error over and over again. The issue does not appear in the Chrome incognito mode or Firefox:

It starts with:
Failed to load resource: net::ERR_TOO_MANY_REDIRECTS from api/auth/session
and then
client.js:2 [next-auth][error][CLIENT_FETCH_ERROR]
{ "message": "Failed to fetch", "stack": "TypeError: Failed to fetch\n at _callee$ (webpack-internal:///./node_modules/.pnpm/next-auth@4.24.5_next@14.0.1_nodemailer@6.9.8_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/client/_utils.js:61:20)\n at tryCatch (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:45:16)\n at Generator.eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:133:17)\n at Generator.eval [as next] (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:74:21)\n at asyncGeneratorStep (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:24)\n at _next (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:22:9)\n at eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:27:7)\n at new Promise (<anonymous>)\n at eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:19:12)\n at fetchData (webpack-internal:///./node_modules/.pnpm/next-auth@4.24.5_next@14.0.1_nodemailer@6.9.8_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/client/_utils.js:24:21)\n at _callee3$ (webpack-internal:///./node_modules/.pnpm/next-auth@4.24.5_next@14.0.1_nodemailer@6.9.8_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/react/index.js:163:41)\n at tryCatch (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:45:16)\n at Generator.eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:133:17)\n at Generator.eval [as next] (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:74:21)\n at asyncGeneratorStep (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:24)\n at _next (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:22:9)\n at eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:27:7)\n at new Promise (<anonymous>)\n at eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:19:12)\n at getSession (webpack-internal:///./node_modules/.pnpm/next-auth@4.24.5_next@14.0.1_nodemailer@6.9.8_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/react/index.js:150:23)\n at _callee$ (webpack-internal:///./node_modules/.pnpm/next-auth@4.24.5_next@14.0.1_nodemailer@6.9.8_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/react/index.js:498:22)\n at tryCatch (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:45:16)\n at Generator.eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:133:17)\n at Generator.eval [as next] (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:74:21)\n at asyncGeneratorStep (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:24)\n at _next (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:22:9)\n at eval (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:27:7)\n at new Promise (<anonymous>)\n at Object.eval [as _getSession] (webpack-internal:///./node_modules/.pnpm/@babel+runtime@7.23.8/node_modules/@babel/runtime/helpers/asyncToGenerator.js:19:12)\n at eval (webpack-internal:///./node_modules/.pnpm/next-auth@4.24.5_next@14.0.1_nodemailer@6.9.8_react-dom@18.2.0_react@18.2.0/node_modules/next-auth/react/index.js:544:16)\n at commitHookEffectListMount (webpack-internal:///./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom.development.js:23145:26)\n at invokePassiveEffectMountInDEV (webpack-internal:///./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom.development.js:25149:13)\n at invokeEffectsInDev (webpack-internal:///./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom.development.js:27346:11)\n at commitDoubleInvokeEffectsInDEV (webpack-internal:///./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom.development.js:27325:7)\n at flushPassiveEffectsImpl (webpack-internal:///./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom.development.js:27051:5)\n at flushPassiveEffects (webpack-internal:///./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom.development.js:26979:14)\n at eval (webpack-internal:///./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/cjs/react-dom.development.js:26764:9)\n at workLoop (webpack-internal:///./node_modules/.pnpm/scheduler@0.23.0/node_modules/scheduler/cjs/scheduler.development.js:266:34)\n at flushWork (webpack-internal:///./node_modules/.pnpm/scheduler@0.23.0/node_modules/scheduler/cjs/scheduler.development.js:239:14)\n at MessagePort.performWorkUntilDeadline (webpack-internal:///./node_modules/.pnpm/scheduler@0.23.0/node_modules/scheduler/cjs/scheduler.development.js:533:21)", "name": "TypeError" }

Finally:

client.js:2 TRPCClientError: UNAUTHORIZED redirect to http://localhost:3000/api/auth/error with the screen below:

Also, a lot of 308 redirects happen in the background:

Can anyone help?

Environment:
System:
OS: Windows 11 10.0.22621
CPU: (12) x64 12th Gen Intel(R) Core(TM) i5-1235U
Memory: 2.18 GB / 15.72 GB
Binaries:
Node: 18.16.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
npm: 9.5.1 - C:\Program Files\nodejs\npm.CMD
pnpm: 8.2.0 - ~\AppData\Roaming\npm\pnpm.CMD
Browsers:
Edge: Chromium (120.0.2210.121)
Internet Explorer: 11.0.22621.1
npmPackages:
next: 14.0.1 => 14.0.1
next-auth: ^4.24.5 => 4.24.5
react: 18.2.0 => 18.2.0

[leandronn]

Facing same issue:

Environment:

OS: MacOS Sonoma 14.5 Beta (23F5059e)
Browser: Version 120.0.6099.129 (Official Build) (x86_64)
Stack:
"next": "14.2.1",
"next-auth": "^4.24.7",
"react": "^18.2.0",

next.config.mjs

import createNextIntlPlugin from 'next-intl/plugin';
 
const withNextIntl = createNextIntlPlugin();
 
/** @type {import('next').NextConfig} */
const nextConfig = {
  images: {
    remotePatterns: [
      {
        protocol: 'https',
        hostname: '*.githubusercontent.com',
        port: '',
        pathname: '/u/**',
      },
      {
        protocol: 'https',
        hostname: '*.googleusercontent.com',
        port: '',
        pathname: '/*/**',
      },
    ],
  }
};
 
export default withNextIntl(nextConfig);

/app/api/[...nextauth]/route.js

import NextAuth from 'next-auth/next';

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

import CustomAdapter from '@/app/adapters';

export const authOptions = {
  secret: process.env.NEXTAUTH_SECRET,
  debug: process.env.NODE_ENV === 'development',
  providers: [
    GithubProvider({
      clientId: process.env.GITHUB_CLIENT_ID,
      clientSecret: process.env.GITHUB_CLIENT_SECRET,
      id: 'github'
    }),
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET,
      id: 'google'
    }),
  ],
  adapter: CustomAdapter(),
  session: {
    strategy: 'database',
    maxAge: 60 * 24 * 60 * 60, // 60 days
    updateAge: 24 * 60 * 60, // 24 hours
  },
  cookies: {
    sessionToken: {
      name: `next-auth.session-token`,
      options: {
        domain: 'localhost',
        httpOnly: true,
        sameSite: 'Lax',
        path: '/',
        secure: false,
      },
    },
  },
  callbacks: {
    async signIn({ user, account, profile, email, credentials }) {
      if (!user) return false;
      return true;
    },

    async redirect({ url, baseUrl }) {
      return baseUrl
    },

    async session({ session, token, user }) {
      if (user) {
        session.user = user;
      }
      return session;
    },
  },
  pages: {
    error: '/auth/errors',
    signIn: '/auth/errors'
  }
};

const handler = NextAuth(authOptions);

export { handler as GET, handler as POST };

[leandronn]

In my browser, emptied cache and hard reloaded the page, worked just fine.

[Enkratia]

@leandronn thank you for this comment

[imceZZ]

@lukaszbeben facing same problem did you found any solution for this.

[leandronn]

I was going crazy. I emptied the cache and hard reloaded the page. Immediatly started working perfect. Have you tried?

[imceZZ]

I deleted everything (cache, local storage) but still I get the error in console while in safari and firefox is ok and also chrome incognito mode

[lukaszbeben]

It's an issue connected to the browser cache NOT site data. Use "Clear browser cache" option for the "session" 403 request in the network tab whenever it happens.

[imceZZ]

thank you thank you so much works