Improve client-side basePath detection

Summary of proposed feature Currently, when the NEXTAUTH_URL env variable contains a basePath also defined in next.config.js, the next-auth/client still cannot pick it up. This is because when Next.js builds the production bundle, it will ignore all environment variables in client code, that is not prepended with NEXT_PUBLIC_ and inline them otherwise. This is described in their documentation here: https://nextjs.org/docs/basic-features/environment-variables#exposing-environment-variables-to-the-browser

Purpose of proposed feature

Iain’s suggestion - where you pass basePath to the options prop of Provider - might work, but you will have to duplicate your basePath, so we might just want to make sure that we also read in NEXT_PUBLIC_NEXTAUTH_URL instead.

Detail about proposed feature

This will ensure that all the URLs have a single source of truth and that the actual path will be inlined at build-time.

Potential problems

Yet another variable might be confusing to users, but I don’t see a better solution immediately. Open for suggestions.

Describe any alternatives you’ve considered

A solution is described here: https://github.com/nextauthjs/next-auth/issues/689#issuecomment-699927237, but it requires duplication. (Eg.: You already implicitly set basePath through NEXTAUTH_URL, it shouldn’t be necessary to duplicate this, especially when we provide an isomorphic next-auth/client module.)

Additional context

Related: #689, #1712, #1517, #900, #499, #1676

Please indicate if you are willing and able to help implement the proposed feature. I will wait for this to get feedback or if anyone has a better idea, please comment below!

[lavcraft]

@balazsorban44 right, but for me it’s not reliable tool. I want to build once and run anywhere 😃 For example - i have many CDN urls and regions. Building app for each region with custom configuration - mindblowing task 😃

Ability to delegate this to infrastructure is a good DevOps practice, because we get one tested artifact and run in many different environments and test only particular cases on specific region.

[balazsorban44]

The value will be INLINED at build time meaning that the reference to process.env.NEXT_PUBLIC_NEXTAUTH_URL would be swapped with a hard-coded string when you run next build. You don’t need any configuration through getInitialProps or getServerSideProps for this. 😉

You won’t expect the NEXTAUTH_URL to change in the lifetime of your deploy anyway.

Update:

I can see you got the same answer from one of the Next.js team member here: https://github.com/vercel/next.js/issues/23734#issuecomment-814042836