Hi @mykola.revutskyi,
Welcome to the Auth0 Community!
The default and recommended behavior in Auth0 is to have a single, customized Universal Login page for multiple applications within one tenant. The routing logic you described—sending a user to a specific application based on their profile—is best handled by a Post-Login Action.
The core concept is that Universal Login is a tenant-level feature, not an application-level one. When you customize the Universal Login page, you customize it for every application your tenant uses.
Your goal of redirecting a user to MVC App 1 or MVC App 2 based on a metadata flag is a common requirement. The secure way to implement this is to have the login flow return information to the calling application, which then performs the final redirection. An Auth0 Action is the perfect tool for securely providing this information.
Here is a step-by-step guide to achieve your desired flow.
1. Customizing the Login Page
The recommended way to have a custom Login Page is to create one using HTML and CSS and use the auth0js library to authenticate the user.
2. Create a Post-Login Action for Routing
The action will take action on the user’s metadata and add the target URL as a custom claim to the ID Token. The application will then use this claim to perform the redirect.
The action should be something like this:
/**
* Handler that will be called during the execution of a PostLogin flow.
*
* @param {Event} event - Details about the user and the context in which they log in.
* @param {PostLoginAPI} api - Interface whose methods can be used to change the behavior of the login flow.
*/
exports.onExecutePostLogin = async (event, api) => {
// Define a namespace for your custom claims to avoid collisions.
const namespace = 'https://myapp.example.com/';
// Get the destination URL from the user's metadata.
// We'll use a fallback URL if the metadata is not set.
const redirectTo = event.user.user_metadata.destination_url || 'https://default-app.example.com/welcome';
// Set the destination URL as a custom claim in the ID Token.
api.idToken.setCustomClaim(`${namespace}post_login_redirect_url`, redirectTo);
};
3. Handle the Redirection in Your Application
When a user is sent back to your application’s /callback endpoint after logging in, your code needs to:
- Process the authentication result and parse the ID Token.
- Look for the custom claim (e.g.,
https://myapp.example.com/post_login_redirect_url).
- Perform a server-side redirect to the URL provided in the claim.
The application that initiates the login will receive the token, inspect the claim, and can then decide to redirect the user to a completely different application if needed. For your use case, you might consider having a single, lightweight “portal” or “dispatcher” application that users log into initially. This app’s only job would be to inspect the token and redirect to the appropriate MVC application.
If you have any other questions, feel free to reach out!
Have a good one,
Vlad