Limit providers listed during Hosted Authentication

Introduction

Customers frequently inquire about how they can remove a particular provider from the 'Choose your Provider' hosted authentication screen. While it's not directly possible to do so, there are methods to manage this issue that can result in a better user experience (UX).

Solution

1. Render a Modal: Within your application, render a modal that requests the user's email address. If the email address is already known, you can ask the user to confirm it.

2. Call the Provider Detection API: Next, call the provider detection API with the confirmed email address to check if it can be detected.

-If the Provider is Detected: If the provider is successfully detected, begin the hosted authentication flow. Pass the provider query parameter along with the disable provider selection option. This prevents the user from navigating to the hosted authentication provider list.
- If the Provider is Not Detected: If the provider detection API is unable to detect the provider, render your own version of the 'Choose your Provider' user interface (UI). You can then display only the providers you want.

Additional Tips

You can alternatively choose to bypass the provider detection step entirely. Instead, you could directly render a list of supported providers at the start.

Request or Code Example

The following is an example URL for hosted authentication:

<!-- Please replace the "xxxx" with appropriate values -->

https://<YOUR_APP_URL>/auth?client_id=xxxx&redirect_uri=xxxx&response_type=code&scope=xxxx&login_hint=xxxx@provider.com&provider=xxxx&disable_provider_select=true

In the above URL, replace the "xxxx" with the appropriate values based on your application details and user information.

Note: The 'disable_provider_select=true' query parameter is used to prevent users from navigating to the hosted auth provider list.

Updated April 24, 2024 18:45