Auth flow using auth0-react and custom signup/login page

Hi everyone. We are building a signup flow for a web app using auth0 and auth0-react. The client requested some extensive customization to a signup page, so we had no choice but to use a self-hosted signup page.

Currently our flow looks like this:

  1. User fills in the signup form;
  2. We send a request to a custom endpoint at our backend;
  3. Our backend validates that the email is free to use, that the password is strong enough, and than we create a user by calling a dbconnections/signup endpoint, as well as store user data in our DB.
  4. After that, we call oauth/token?grant_type=password, and we get an access token.
  5. We return access token to the client-side.

My question is, how can we feed our access token to the auth0-react library? There is some codebase on the client-side that relies on auth0-react, so we would really like to reuse it. If it makes things simpler, we could move p.4 to the client-side, but I assume it is a bad idea since it requires the secret key as one of the parameters.

Another question is, how do I manage refresh tokens with such an approach? We are currently in an early development phase, so we did not look into session expiration and stuff like that, but this will probably become an issue later. Assuming I will be able to “set” user identity from my access token retrieved from my custom API, will I be able to rotate it automatically by native means of Auth0?

And, just in case, we cannot use Universal login. We tested it and it does not work for our use-cases. So we have to use a custom login/signup page and some means to call Auth0 api while managing session.

Hi @yuriymironov96

Welcome to the Auth0 Community!

Apart from your questions, what use cases are missing for the Universal Login to meet your needs?

Thanks
Dawid

I do understand you want specifics to consider adding new features to your roadmap, but I am really not ready to list all the problems and concerns that we have regarding the Universal Login. Maybe later - I know you have ways to submit feedback about this.

Long story short, our sign-in/signup forms are too complex to be hosted outside, and we wanted a self-hosted solution. Which is perfectly reasonable and, AFAIK, doable. And I see no reason why we could not use auth0-react to handle session after the user signed in.

I am perfectly pleased with auth0-react, I just want a way to manually start a session and let auth0-react do the rest: user display, access token rotation etc. The only missing piece is updating auth0-react state with the session obtained through Resource Owner Password Flow.

I am facing same problem that you are. We are going to build our own login flow including Passwordless login, OTP verification, Organisation login, etc. I end up to the solution with Auth0.js V9 + NextAuth. You can choose any session management tech you want, I use NextAuth to handle session on my client. I have read a lot of documentations that Auth0 recommend to use Universal Login page which really not fits for the production in business. All SDKs except Auth0.js are end up to call loginWithRedirect() function to engage Universal Login page as I know so far.

Hi Dawid,
Please help us out, how can we use our own FE lib to build our own pages for login flow rather than engaging Auth0 Universal Login page? Thanks.
P.S. As a user management platform, Auth0 should not dig into UI too much. Your SDKs for SPA, Regular Web App are all working as expected but please free us of UI staff.