nextauthjs / next-auth

Authentication for the Web.
https://authjs.dev
ISC License
24.05k stars 3.33k forks source link

Adding base path to nextjs breaks oauth/oidc signin #9984

Open amsal opened 6 months ago

amsal commented 6 months ago

Environment

System: OS: macOS 14.1 CPU: (11) arm64 Apple M3 Pro Memory: 1.84 GB / 36.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 20.11.0 - ~/.nvm/versions/node/v20.11.0/bin/node npm: 10.2.4 - ~/.nvm/versions/node/v20.11.0/bin/npm Browsers: Chrome: 121.0.6167.160 Safari: 17.1 npmPackages: next: 14.1.0 => 14.1.0 next-auth: ^5.0.0-beta.9 => 5.0.0-beta.9 react: ^18 => 18.2.0

Reproduction URL

https://github.com/amsal/next-auth-basepath

Describe the issue

Setting basePath for next app in next config does not set the base path for next-auth sign in.

How to reproduce

Run the project (Next basePath is set to myapp). Go to sign in page http://localhost:3000/myapp/api/auth/signin which outputs

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

Changing the basePath from '/myapp/api/auth' to '/api/auth' in auth.ts shows the sign in page again but the urls are not prefixed with base path. Form action url is http://localhost:3000/api/auth/signin/github and callback url is http://localhost:3000

Also setting the environment variable AUTH_URL did not solve the issue

Expected behavior

Should display the login page including urls with correct base path set

jenewland1999 commented 6 months ago

Funnily enough this happens regardless of if you set the basePath option in either Next.js or Auth.js. If I had to guess, there's either a bug or they've purposely removed the ability to hit that route and have a page returned and instead it's just a POST route now.

I've tried this with beta.9 both with the latest next release and the latest next canary.

dichioniccolo commented 6 months ago

The problem seems to be present from beta.9, having the same issue with Magic Links after upgrading

stunaz commented 6 months ago

exactly... there is a nasty bug on beta.9

jenewland1999 commented 6 months ago

Funnily enough this happens regardless of if you set the basePath option in either Next.js or Auth.js. If I had to guess, there's either a bug or they've purposely removed the ability to hit that route and have a page returned and instead it's just a POST route now.

I've tried this with beta.9 both with the latest next release and the latest next canary.

Turns out if I removed the AUTH_URL (or NEXTAUTH_URL) and restarted the dev server things worked again. Not sure if this is the case with basePath too, but worth a try.

jenewland1999 commented 6 months ago

Seems if you set AUTH_URL everything breaks. If you set a basePath in next.config.js things work fine till you click the sign in button which then takes you to the /api/auth/signin (missing the basePath) If you change basePath in auth.ts it then doesn't redirect you to the correct path if you're using middleware. You end up on /foo/foo/api/auth/signin (where foo is the basepath you set)

Also, I feel like having basePath in both next.config.js and in the next auth config is confusing. It would be great if next-auth could just use the value set in next.config.js but I appreciate next.js might not expose that value to let next-auth detect it.

michaelrazmgah commented 6 months ago

If you run the next-auth api routes on edge it seems to solve this issue: export const runtime = "edge"; // optional

However other issues arise with edge where not all routes are working as expected. For example when callback fails it does not route to the error page, but instead throws a 500 error...

I am using edge for now in hopes that this will be resolved soon. I am using multi zone nextjs with the authenticated app being on a subpath: /app so I need to set the AUTH_URL...

jenewland1999 commented 6 months ago

If you run the next-auth api routes on edge it seems to solve this issue: export const runtime = "edge"; // optional

However other issues arise with edge where not all routes are working as expected. For example when callback fails it does not route to the error page, but instead throws a 500 error...

I am using edge for now in hopes that this will be resolved soon. I am using multi zone nextjs with the authenticated app being on a subpath: /app so I need to set the AUTH_URL...

Unfortunately, all this did was give me the following error message: "Error: This action with HTTP GET is not supported."

But thanks though. 😄

pedro757 commented 6 months ago

I'm using 5.0.0-beta.15 and I can confirm that setting AUTH_URL or NEXTAUTH_URL breaks the app.

amatosc commented 5 months ago

I'm facing this issue on 5.0.0-beta.16 as well

e-karma commented 4 months ago

After many hours chasing other possible causes, turns out this is the problem for me as well on 5.0.0-beta.16. Do I need to rip out next-auth? or is this likely to be addressed soon..

TomWonder commented 3 months ago

Same issue in v5 beta.17. This issue should be addressed as soon as possible since it is very important to be able to set a base path; for instance when you use a reverse proxy

@balazsorban44 @ThangHuuVu

tunchunairarko commented 3 months ago

Same issue for me as well https://github.com/nextauthjs/next-auth/discussions/10234#discussioncomment-9547960.

DanielRitvas commented 1 month ago

beta 19, still the same.

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!