basePath is constructed incorrectly, resulting in invalid URLs

[noblejasper]

OAuth-based authentication providers such as Google are set up.
When a user with the same email address exists and performs a Google login, the OAuthAccountNotLinked error occurs.
It is a correct behavior to occur. However, the redirected page is /api/auth/auth/login?error=OAuthAccountNotLinked.
What I expect is /auth/login?error=OAuthAccountNotLinked.

I would appreciate it if you could point out any errors in the configuration.

The environment variables AUTH_URL and NEXTAUTH_URL are not set.

NextAuthConfig looks like this

export const options: NextAuthConfig = {
  ....
  pages: {
    signIn: "/auth/login",
    verifyRequest: "/auth/verify-request",
    error: "/auth/error",
  },
  basePath: "/api/auth",
};

[masterjanic]

I can also confirm this issue with similiar setup. I have set AUTH_URL="https://{my_url}/api/auth" in production and AUTH_URL="http://localhost:3000/api/auth" in development. My pages and basePath is the same as @noblejasper

The logs show something like this:

[auth][error] OAuthCallbackError: OAuth Provider returned an error .Read more at https://errors.authjs.dev#oauthcallbackerror
    at <anonymous> (/app/.next/server/chunks/2883.js:361:26985)
    at asyncFunctionResume (native)
    at promiseReactionJobWithoutPromiseUnwrapAsyncContext (native)
    at promiseReactionJob (native)
    at processTicksAndRejections (native)
[auth][error] UnknownAction: Cannot parse action at /api/auth/auth/login .Read more at https://errors.authjs.dev#unknownaction

I tried following the conversations in #10094 but still don't understand this behaviour. Maybe @ndom91 can explain?

[ndom91]

Hey folks, so the default basePath with next-auth is /api/auth, so you don't need to explicitly set that option.

Does it help to remove that from your config?

[masterjanic]

Hey folks, so the default basePath with next-auth is /api/auth, so you don't need to explicitly set that option.

The docs show that the default is /auth? Or is /api appended at the beginning?

However removing it from the config results in the same error: Being redirected to https://{url}/api/auth/auth/error?error=Configuration

[ndom91]

Yeah sorry that this is so confusing 😅. For backward compatability and such, we decided to keep /api/auth for next-auth, but sveltekit and every other framework uses /auth.

Anyway, it looks like there's still an errant /auth being appended onto the path from somewhere 🤔

[masterjanic]

Yeah, but as far as I understand the AUTH_URL must be set with trailing /api/auth otherwise I get the error that the action /session is not defined. And by omitting AUTH_URL completely I get redirected to the Docker internal hostname of 0.0.0.0 and the redirect url is invalid. So I am a bit clueless...

[noblejasper]

Thank you for your comment, I will try to fix the problem.
I am using next.js, so removing the basePath setting makes no difference.

I get a redirect to http://{url}/api/auth/auth/login?error=OAuthAccountNotLinked.

In my environment, setting basePath to /auth caused /session to become 400 (Bad Request).

[LakiDIV]

I'm getting the same error
when I add the following line to auth.ts,

 pages: {
    signIn: "/auth/login",
    error: "/auth/error",
  },

OAuthAccountNotLinked error occurs when a user with the same email address exists and performs a Google login
http://localhost:3000/api/auth/auth/login?error=OAuthAccountNotLinked and says "Bad request." ,
I'm trying to redirect from the default error interface to a custom one and need help

[dresandev]

same

[ndom91]

Hey folks, so as far as i can tell, all of these come down to a bug in the way basePath and AUTH_URL were handled together

A fix was recently merged, but isn't released yet (#10094 + sister PRs), I'll post again once a release is out.

If anyone wants to try to install github main, we'd really appreciate some feedback if this fixes it for you 🙏

[ndom91]

Update, fix is out in beta.16+. Please let us know if it fixes it for you or if you still have issues 🙏

[julianthant]

/** @type {import('next').NextConfig} */
const nextConfig = {
async redirects() {
return [
{
source: '/api/auth/auth/:slug',
destination: '/auth/:slug',
permanent: true,
},
];
},
};

export default nextConfig;
this is what i did to fix the error

[nikki9696]

"And by omitting AUTH_URL completely I get redirected to the Docker internal hostname of 0.0.0.0 and the redirect url is invalid"

We are having this issue, and I found this thread. Has the fix mentioned above been put into a release anywhere so we can see if it fixes our specific issue? If not, I'm not sure how I can try the fix but I'd like to.

[ndom91]

The fix is available in the latest releases, [email protected], for example.

Also theres a working Docker example in the repo here

[tunchunairarko]

Hi,

I am still having issues. I am using Nextjs14 app router. I am using [email protected]. I want to run my app locally at http://localhost:8045/app3, because on server I can deploy at https://example.com/app3. These are the things I have done so far:

• Modified next.config.js to handle subpath routing (https://nextjs.org/docs/app/api-reference/next-config-js/basePath)[https://nextjs.org/docs/app/api-reference/next-config-js/basePath]
• Followed Nextjs's official documentation to integrate next-auth with Next.js (https://nextjs.org/learn/dashboard-app/adding-authentication)[https://nextjs.org/learn/dashboard-app/adding-authentication]
• Added the following code to auth.config.ts, NGINX_SUBPATH_ROUTE=app3:

//auth.config.ts
import type { NextAuthConfig } from 'next-auth';

export const authConfig = {
  pages: {
    signIn: '/login',
  },
  basePath: process.env.NGINX_SUBPATH_ROUTE || '',
  callbacks: {
    authorized({ auth, request: { nextUrl } }) {
      // const basePath = process.env.NGINX_SUBPATH_ROUTE || ''; 
      const isLoggedIn = !!auth?.user;
      const isNotInLogIn = !nextUrl.pathname.startsWith('/login');
      if (isNotInLogIn) {
        if (isLoggedIn) return true;
        return Response.redirect(new URL('/login', nextUrl)); // Redirect unauthenticated users to login page
      } else if (isLoggedIn) {
        return Response.redirect(new URL('/', nextUrl));
      }
      return true;
    },
  },
  providers: [], // Add providers with an empty array for now
  trustHost: true,
} satisfies NextAuthConfig;

// 'auth.ts';

import NextAuth, { type DefaultSession } from 'next-auth';
import { authConfig } from './auth.config';
import Credentials from 'next-auth/providers/credentials';
import { LoginVariables, AuthenticatedUser } from './types/globals';
import backendFetchAPI from './app/utils/backend-fetch-api';

declare module 'next-auth' {
  /**
   * Returned by `auth`, `useSession`, `getSession` and received as a prop on the `SessionProvider` React Context
   */
  interface Session {
    user_details: {
      user: any;
      access_token: string;
      token_type: string;
      /**
       * By default, TypeScript merges new interface properties and overwrites existing ones.
       * In this case, the default session user properties will be overwritten,
       * with the new ones defined above. To keep the default session user properties,
       * you need to add them back into the newly declared interface.
       */
    } & DefaultSession['user'];
  }
}

async function loginUser(username: string, password: string): Promise<LoginVariables | AuthenticatedUser | undefined> {
  try {
    const user = await backendFetchAPI<AuthenticatedUser>('/auth/login', 'POST', {}, { username, password }, true);
    return {
      ...user,
    };
  } catch (error) {
    console.error('Error logging in:', error);
    return undefined;
  }
}

export const { auth, signIn, signOut } = NextAuth({
  ...authConfig,
  providers: [
    Credentials({
      credentials: {
        username: { label: 'Username', type: 'text', placeholder: 'Username' },
        password: { label: 'Password', type: 'password' },
      },
      // @ts-ignore
      authorize: async (credentials: any) => {
        const user = await loginUser(credentials.username, credentials.password);
        if (!user) return null;
        return user;
      },
    }),
  ],
  secret: process.env.AUTH_SECRET,
  session: {
    strategy: 'jwt',
    maxAge: 180 * 24 * 60 * 60,
  },
  debug: true,
  callbacks: {
    async session({ session, token }) {
      // @ts-ignore
      session.user_details = token.user;
      return session;
    },
    async jwt({ token, user }) {
      if (user) {
        token.user = user;
      }
      return token;
    },
    // async authorized({ auth, request: { nextUrl } }) {
    //   console.log(nextUrl.pathname)
    //   const basePath = process.env.NGINX_SUBPATH_ROUTE || ''; 
    //   const isLoggedIn = !!auth?.user;
    //   const isNotInLogIn = !nextUrl.pathname.startsWith('/login');
    //   if (isNotInLogIn) {
    //     if (isLoggedIn) return true;
    //     return Response.redirect(new URL('/login', nextUrl)); // Redirect unauthenticated users to login page
    //   } else if (isLoggedIn) {
    //     return Response.redirect(new URL('/', nextUrl));
    //   }
    //   return true;
    // },
  },
});

Nothing happens. It just does not route to the login page whatever I do. Even almost no error logs appear. Randomly I get the following error:

Error handling upgrade request TypeError: Cannot read properties of undefined (reading 'bind')
    at DevServer.handleRequestImpl...

I have a dashboard app with a couple of screens, and users need to login to enter the app. Next-auth works if I don't add any basePath/subpath, if it runs at localhost:8045. But it doesn't work at http://localhost:8045/app3. I also tried:

• Setting NEXTAUTH_URL
• Setting debugging to true (found no log)

What am I doing wrong here?

[ndom91]

So it doesn't look like youre using a database adapter, is that right? In that case you don't need to split your configuration into two files as shown in the Next.js guide.

Id recommend following our installation guide instead and double checking if everything is setup as designed: https://authjs.dev/getting-started/installation

Let me know afterward if you're still running into issues 🙏

[tunchunairarko]

Hi @ndom91 ,

So I followed your instruction:

• Combined my configuration files into one file, just auth.ts
• Followed the getting started guide

However, no success, the error still remained there if I run my app on a subpath (http://localhost:8045/app3). It works perfectly fine if I don't run on a subpath (http://localhost:8045). For context, due to this project's requirements and constraints, this app has to be deployed on a subpath via Nginx.

[hscstudio]

I have do it in auth 5 and no success same with You. I have no find solution in google and many social media programming... I confuse now

have do it in next-auth 4?

[calcavara]

I've got the same problem as you guys, running a Next.js app on root address gives me no problem at all but running the same application on a basePath route makes it stop working, even though it's correctly configured. I've tried cloning the next-auth-example and set it up for basePath usage and I get the same problem, what leads me to think it's an issue with the Authjs v5 framework.

Not sure downgrading to v4 will solve the issue, will try and keep you posted here.

[forbesd7]

@ndom91 is there any way you are able to check on this PR? #10797 it seems like this fixes the issue.

[andreynovikov]

Have a look here: #12160