Skip to content

basePath doesn't work in Next.js - wrong redirect_uri or response with 400 BAD REQUEST #13034

@thepeterkovacs

Description

@thepeterkovacs

Environment

System:
OS: Windows 10 10.0.19045
CPU: (28) x64 13th Gen Intel(R) Core(TM) i7-13850HX
Memory: 16.98 GB / 31.61 GB
Binaries:
Node: 24.0.2 - C:\Program Files\nodejs\node.EXE
npm: 11.4.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: Chromium (134.0.3124.85)
Internet Explorer: 11.0.19041.5794
npmPackages:
next: 15.3.3 => 15.3.3
next-auth: ^5.0.0-beta.28 => 5.0.0-beta.28
react: ^19.0.0 => 19.1.0

Reproduction URL

https://github.com/vercel/next.js/tree/canary/examples/auth

Describe the issue

Using a basePath in Next.js makes next-auth either to send the invalid redirect_uri without the basePath, or just not work at all and return 400 BAD REQUEST for all endpoints.

Case 1:
Having a basePath in Next.js but not providing it to the auth config.

// next.config.ts

import type { NextConfig } from "next"

const nextConfig: NextConfig = {
  basePath: "/my-base-path",
}

export default nextConfig
// src/auth.ts

import NextAuth from "next-auth"
import MicrosoftEntraID from "next-auth/providers/microsoft-entra-id"

export const { handlers, signIn, signOut, auth } = NextAuth({
  // basePath: "/my-base-path/api/auth",
  providers: [
	MicrosoftEntraID({
		clientId: process.env.AUTH_MICROSOFT_ENTRA_ID_ID,
		clientSecret: process.env.AUTH_MICROSOFT_ENTRA_ID_SECRET,
		issuer: process.env.AUTH_MICROSOFT_ENTRA_ID_ISSUER,
	  }),
  ],
})
// src/app/api/auth/[...nextauth]/route.ts

import { handlers } from '~/auth'

export const { GET, POST } = handlers

After the successful sign-in, it redirects to the /api/auth/callback/microsoft-entra-id (without the basePath).
It is expected to be redirected to the /my-base-path/api/auth/callback/microsoft-entra-id path instead.
Side note: the /my-base-path/api/auth/providers endpoint works properly.

Case 2:
The basePath is provided to the auth config as well.

// auth.ts

import NextAuth from "next-auth"
import MicrosoftEntraID from "next-auth/providers/microsoft-entra-id"

export const { handlers, signIn, signOut, auth } = NextAuth({
  basePath: "/my-base-path/api/auth",
  providers: [
	MicrosoftEntraID({
		clientId: process.env.AUTH_MICROSOFT_ENTRA_ID_ID,
		clientSecret: process.env.AUTH_MICROSOFT_ENTRA_ID_SECRET,
		issuer: process.env.AUTH_MICROSOFT_ENTRA_ID_ISSUER,
	  }),
  ],
})

After the successful sign-in, it redirects to the correct /my-base-path/api/auth/callback/microsoft-entra-id path, but with a 400 BAD REQUEST.
Side note: The /my-base-path/api/auth/providers responds with 400 as well.

How to reproduce

Just simply set up a clean Next.js application with Auth.js Microsoft Entra ID provider and use a basePath. All necessary code is seen above. Probably can be reproduced using a different provider, not sure.

Expected behavior

The expected behaviour is for it to actually work, or the documentation to be updated. Other info is the issue description.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workingtriageUnseen or unconfirmed by a maintainer yet. Provide extra information in the meantime.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions