Authentication With Custom Login Page

Hi there,

Our stack right now consists of a NextJS frontend and Typescript Express/Graphql server. We currently handle all our authentication through nextjs-auth0 on our frontend and it works perfectly. We’ve recently started working with another platform that requires us to change how we’re doing our authentication. Right now the only way a user can register on our platform is by going through our site and using the Auth0 lock. Now, however, a user can register via a third party site, the flow would look something like this:

  • Go to the third party site.
  • Buy membership to our platform.
  • Get redirected to our platform to create an account.
  • Register an account and automatically sign in.

The problem at the moment is that when a user gets redirected to our registration form (currently the Auth0 lock) we need to pass the email used on the third-party site with them, which is fine, but they cannot be allowed to change it. From what I can tell there’s no way for us to populate the email field on the Lock and disable it. This leaves us with trying to create a custom login page and using the Authentication API/Management API to call the appropriate endpoints ourselves. I’m struggling to find any examples of how to go about doing this. I’ve come across auth0-js which looks like we might be able use to accomplish this. Any help/examples of how we might accomplish this would be greatly appreciated.

Regards,
Tom

Never knew you could have a completely custom HTML page instead of using the standard lock. Problem solved.