Custom SSO login page without Auth0 lock

Hello!

We’ve been using the Universal classic login experience with our own custom HTML file.

In order to implement our own login page design, we import auth0.js script and use these two functions to implement the login.

  • webAuth.passwordlessStart
  • webAuth.passwordlessLogin

We don’t want any third-party Oauth nor do we use password-based login. So this implementation has been relatively easy and very customizable. We control everything that gets displayed at our custom login domain.

However, in order to support SSO login, we still need to use Auth0 lock. We create a new Auth0 lock and specify which div to take over. This provides the functionality that we need but the SSO login screen that asks for email addresses looks very different. How can we perform SSO login with auth0js? I have gone through the docs pretty extensively and cannot find any API that could help us implement this other than webAuth.getSSOData.

Thanks!

For reference, this is the design discrepancy that we would like to address

Passwordless login:


SSO login:

Hello @nishan did you find any solution to this?, I’m trying to implement something similar on my end, i have an universal custom login that looks like this and works fine


then when i click on SSO option
image
here is where idk how the Auth0.js handle the SSO login, the documentation is not helping me, do you have any insight that can help me? thank you.

@javier.paternina Nope! We couldn’t find any customization option for this so we went with the default auth0lock UI. I just instantiated a new Auth0Lock({..SSOConfig}) and open it lock.show() on the SSO button click. It then loads an alternative login page provided by auth0 without any customizations.

Thanks @nishan for your answer.

How did you set up this login page?