nextauthjs / next-auth

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

for seperating api, ssg not working with NEXTAUTH_BASE_URL. #8132

Open guhyeon77 opened 1 year ago

guhyeon77 commented 1 year ago

Environment

System: OS: Windows 10 10.0.19044 CPU: (24) x64 AMD Ryzen 9 5900X 12-Core Processor Memory: 31.87 GB / 63.92 GB Binaries: Node: 19.9.0 - C:\Program Files\nodejs\node.EXE npm: 9.6.3 - C:\Program Files\nodejs\npm.CMD pnpm: 8.6.7 - C:\Program Files\nodejs\pnpm.CMD Browsers: Edge: Spartan (44.19041.1266.0), Chromium (115.0.1901.183)
Internet Explorer: 11.0.19041.1566

"next": "13.4.10",
"next-auth": "4.22.3",
"react": "^18.2.0",
"react-dom": "^18.2.0"

Reproduction URL

https://next-auth-example-ssg.vercel.app

Describe the issue

I was testing if it works with Nextjs' SSG method with the idea of floating nextAuth as a separate instance and domain. For example, nextAuth's api server is 'id.mydomain.com' and web site as 'www.mydomain.com' .

So I followed guide [https://next-auth.js.org/getting-started/client#custom-base-path]

To do what's in the guide

.env.local

NEXTAUTH_URL=https://next-auth-example-ssg.vercel.app/api/auth
NEXT_PUBLIC_NEXTAUTH_BASE_URL=/api/auth

After doing this,

_app.tsx

<SessionProvider session={session} baseUrl={process.env.NEXT_PUBLIC_NEXTAUTH_BASE_URL}>

I modified it to and use code.

import { signIn, signOut, useSession } from "next-auth/react"

When using a function such as signIn in It does not go to NEXTAUTH_URL.

How to reproduce

clone https://github.com/guhyeon77/next-auth-example-ssg pnpm install

pnpm dev

then local is ssg https://next-auth-example-ssg.vercel.app is server.

Expected behavior

when pressing [sign in] button it going to https://next-auth-example-ssg.vercel.app/api/auth/signin

mustafamoe commented 7 months ago

I have spent hours trying to make it work, and it's not working 😆. but i think this solution will work https://medium.com/@badjessab/share-auth-session-between-nextjs-multi-zones-apps-using-nextauth-js-5bab51bb7e31

although i don't prefer it, it would be nice to have the api routes in auth.example.com and when i use in app.example.com it calls that domain to get the session etc.. i guess you can't have it all

mustafamoe commented 7 months ago

The solution worked but don't forget to enable cors