Remove the requirement to configure the `AUTH0_BASE_URL`

[RobertAron]

Checklist

• I have looked into the Readme, Examples, and FAQ and have not found a suitable solution or answer.
• I have looked into the API documentation and have not found a suitable solution or answer.
• I have searched the issues and have not found a suitable solution or answer.
• I have searched the Auth0 Community forums and have not found a suitable solution or answer.
• I agree to the terms within the Auth0 Code of Conduct.

Describe the problem you'd like to have solved

Requiring setting the AUTH0_BASE_URL complicates deployment. As far as I can tell it seems unnecessary.

Describe the ideal solution

Instead of having the AUTH0_BASE_URL be a required environment variable, it could be optional. In cases where it's not supplied, the login behavior will log back wherever the initial request came from.

Alternatives and current workarounds

import {
  handleAuth,
  handleCallback,
  handleLogin,
  handleLogout,
} from "@auth0/nextjs-auth0";

function getRedirectUrls(webUrl: string | undefined) {
  if (webUrl === undefined)
    throw new Error("Error get base Url. Missing request URL.");
  const urlObject = new URL(webUrl);
  const returnTo = `${urlObject.protocol}//${urlObject.host}`;
  return {
    returnTo,
    redirect_uri: `${returnTo}/api/auth/callback`,
  };
}

export const GET = handleAuth({
  // @ts-ignore
  callback: (req, res) => {
    const { redirect_uri } = getRedirectUrls(req.url);
    return handleCallback(req, res, {
      authorizationParams: {
        audience: "https://my-audience.us.auth0.com/api/v2/",
        scope: "openid profile email offline_access",
        redirect_uri: redirect_uri,
      },
      redirectUri: redirect_uri,
    });
  },
  // @ts-ignore
  login: (req, res) => {
    const { returnTo, redirect_uri } = getRedirectUrls(req.url);
    return handleLogin({
      authorizationParams: {
        audience: "https://my-audience.us.auth0.com/api/v2/",
        scope: "openid profile email offline_access",
        redirect_uri,
      },
      returnTo,
    })(req, res);
  },
  // @ts-ignore
  logout: (req, res) => {
    return handleLogout({
      returnTo: getRedirectUrls(req.url).returnTo,
    })(req, res);
  },
});

Additional context

Here are some other links that I think are relevant.

#298 This makes it seem like it's an OK solution for this to be dynamic
It's even suggested here: https://community.auth0.com/t/configure-multiple-domains-with-nextjs/107002

Overriding during runtime seems ok #552

It would remove the need for special configuration for deployments like vercel. #383

As far as I can it would be completely safe for this behavior since auth0 configuration requires that you list the allowed callback URLs on the auth0 dashboard.

Thanks for all your hard work <3

[cdaringe]

Right, something like this ought be considered.

By default, Vercel deploy sets multiple domains for which you can access your app:

1. your primary/default domain
2. a branch domain
3. a temp deployment domain

This SDK kind of only wants to be compatible with a single one of those domains at a time.

I think this SDK should either derive the current domain as proposed above, or allow me to simply specify the domain at runtime at callsites. My app is supportive of N simultaneous domains, but this SDK pigeonholes me into a single.

[adamjmcgrath]

Thanks for raising this @RobertAron

Requiring setting the AUTH0_BASE_URL complicates deployment.

You should not require AUTH0_BASE_URL during deployment, this is an issue with the App Directory and Next.js static rendering. We're still investigating if this is an issue with Next.js - see #1235 (comment)

For use cases where you want to run your application on multiple domains, you can create multiple instances using initAuth0 or use the solution described by the OP.

We have no plans to change the requirement on the base url, trusting the req can be unreliable - especially with proxies etc. So we have no plans to change the default behaviour and instead provide extensibility to support this use case.

[dopry]

You can also just set redirectURI explicitly when calling handleLogin or handleCallback. As far as I can tell the AUTH0_BASE_URL really just sets the default base url for those.

[RobertAron]

I understand that it's possible. This was my solution:

import { auth } from "@/authUtils/edge/auth";

export const runtime = "edge";

function getRedirectUrls(webUrl: string | undefined) {
  if (webUrl === undefined) throw new Error("Error get base Url. Missing request URL.");
  const urlObject = new URL(webUrl);
  const returnTo = `${urlObject.protocol}//${urlObject.host}`;
  return {
    returnTo,
    redirect_uri: `${returnTo}/api/auth/callback`,
  };
}

// The reason this is all overloaded is to remove the requirement to include the various environment variables.
// The most complicated fix of these is `AUTH0_BASE_URL`
// AUTH0_BASE_URL is still require due to the library checking to make sure it's there (even though it's not used.)
// https://community.auth0.com/t/configure-multiple-domains-with-nextjs/107002
// https://github.com/auth0/nextjs-auth0/issues/552
// https://github.com/auth0/nextjs-auth0/issues/383
export const GET = auth.handleAuth({
  // @ts-ignore
  callback: (req, res) => {
    const { redirect_uri } = getRedirectUrls(req.url);
    return auth.handleCallback(req, res, {
      authorizationParams: {
        audience: "https://myAudience.com/api/v2/",
        scope: "openid profile email offline_access",
        redirect_uri: redirect_uri,
      },
      redirectUri: redirect_uri,
    });
  },
  // @ts-ignore
  login: (req, res) => {
    const { returnTo, redirect_uri } = getRedirectUrls(req.url);
    return auth.handleLogin({
      authorizationParams: {
        audience: "https://myAudiencecom/api/v2/",
        scope: "openid profile email offline_access",
        redirect_uri,
      },
      returnTo,
    })(req, res);
  },
  // @ts-ignore
  logout: (req, res) => {
    return auth.handleLogout({
      returnTo: getRedirectUrls(req.url).returnTo,
    })(req, res);
  },
});

Still though...it feels excessive. Especially since you have to set the AUTH0_BASE_URL even if it's never used.