Sign In page Buttons don't respect basePath when clicked

[jenewland1999]

Environment

System:
OS: macOS 14.3.1
CPU: (8) arm64 Apple M1 Pro
Memory: 1.34 GB / 32.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.11.0 - ~/Library/Caches/fnm_multishells/47131_1707656901311/bin/node
Yarn: 1.22.21 - ~/Library/Caches/fnm_multishells/47131_1707656901311/bin/yarn
npm: 10.2.4 - ~/Library/Caches/fnm_multishells/47131_1707656901311/bin/npm
pnpm: 8.15.1 - ~/Library/pnpm/pnpm
bun: 1.0.26 - ~/.bun/bin/bun
Browsers:
Chrome: 121.0.6167.160
Safari: 17.3.1
npmPackages:
next: ^14.1.0 => 14.1.0
next-auth: 5.0.0-beta.9 => 5.0.0-beta.9
react: ^18.2.0 => 18.2.0

Reproduction URL

https://github.com/jenewland1999/next-auth-bug-repro

Describe the issue

Using the basePath option in Next.js does not currently work with the latest beta of NextAuth.js.

This is because when you're taken to the sign in or sign out page, clicking the button will send you to a URL that does not include the basePath. Setting the basePath option in NextAuth.js does not affect this.

Furthermore, the use of the AUTH_URL environment variable causes all the endpoints NextAuth.js creates to return the following error message:

"Error: This action with HTTP GET is not supported."

How to reproduce

1. Clone the example
2. Create a .env file with the AUTH_SECRET and your Provider secrets of choice (in my case that's Azure AD)
3. If you've chosen a different provider, configure accordingly in the auth.ts file
4. Start the dev server and navigate to http://localhost:3000/foo
5. Click the login button

You will now be on a 404 page.

Expected behavior

The basePath is taken into account when clicking the sign in or sign out button on the inbuilt pages. And specifying AUTH_URL also doesn't return the above error message.

[jenewland1999]

Still an issue with beta.11

[sx-bpreck]

I am facing the same issue on version 4.24.7

[TomWonder]

I am facing the same issue on version 4.24.7

Same here

[TomWonder]

Same issue also on v5 beta.17

[TomWonder]

Workaround here:

1. Switch back to 4.24.7
2. Use SessionProvider and pass basePath to it (I've set it to /<base-path>/api/auth/)
   (the docs say that SessionProvider is not needed for App Route, but it is still valid to help migrating from pages - in this case also because it makes basePath work)

References:

• Stackover flow post on how to make SessionProvider work in case of "React Context is unavailable in Server Components" error
• NextAuth v4 SessionProvider Options Doc