Redirect users to organization specific subdomain after login

Hello,

I am setting up a B2B application where customer applications are hosted on their own subdomain (e.g. companyA.myapp.com, companyB.myapp.com)

These are currently treated as different applications and users navigate to their subdomain, get kicked to the Auth0 login flow, then get redirected back to the original subdomain.

I would like to move this to a “universal” login page where users can go to any subdomain and login with their organization, user, and password, then get redirected to their subdomain.

I’ve gotten started with organizations but I can’t figure out how to do the redirect.

I’m using the “New Universal Login Experience” and this library react-oidc-context - npm in my application like so:

      <AuthProvider
        authority={config.oauth.authority}
        client_id={config.oauth.clientId}
        redirect_uri={window.location.origin}
        ...
      >
        <BrowserRouter>
          <Main />
        </BrowserRouter>
      </AuthProvider>

Now when the user goes to log in, they are first prompted for their organization, then get directed to their organization-specific login page.

But after logging in, they get redirected back to the original redirect_uri. For example:

  1. UserA@companyA.org navigates to companyB.myapp.com
  2. UserA@companyA.org gets redirected to Auth0 for login
  3. UserA@companyA.org enters in organization companyA
  4. UserA@companyA.org gets redirected to the organization-specific login page
  5. UserA@companyA.org enters in their credentials
  6. UserA@companyA.org gets redirected back to companyB.myapp.com

The desired behavior is to have step 6 redirect the user to companyA.myapp.com.

I’ve tried using actions to redirect the user (Redirect with Actions) but this doesn’t accomplish this since it only delays the inevitable redirect back to the original redirect_uri.

Is there a way to get this to work?

Hi @chan.lee , Welcome to the Auth0 community!

Thanks for the explanation, I believe this redirect can all be handled by Auth0 using Subdomain URL Placeholders within the Application Callback URL.
On this page, here, you can see there is the {organization_name} placeholder that can be used.
I hope this info provides the solution you are looking for, thanks!

Hi @nathan.jenkins

Thanks for the reply. I’ve tried using {organization_name} but it still requires you to know the final subdomain before initiating the auth flow.

In my provided example, if UserA@companyA.org navigates to companyB.myapp.com, redirect_uri gets set to companyB.myapp.com and I can not find a way to change that to companyA.myapp.com, even if the user inputs companyA in the organization prompt.

Is there a way to get around this limitation?

I’ve tried the adjusting the project to do the following but still running into issues:

I can see that there are a few cookies set (organization_hint and is.authenticated) and transferred to the subdomain but I still get kicked to the login page.

I raised an issue on the auth0-react project and a developer on the project pointed out a critical Auth0 cookie was not being transferred on redirect due to my browser settings: `cookieDomain` doesn't seem to share auth between (sub)domains · Issue #523 · auth0/auth0-react · GitHub

Switching my Chrome cookie settings from “Block third-party cookies” to “Allow all cookies” fixed my issues and everything is now working as expected.

2 Likes

Hi @chan.lee ,
Great to hear that it’s working now, and thank you very much for providing that information here!

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.