Custom Login / Signup + Buttons with options to login/signup with google / facebook / etcs?

General
,
#1

Hello,

I’m currently implementing a custom LOGIN / SIGN UP form on my React application ( it happens in a modal inside of my app), which will allow users to set their own password, then receive an email, confirm email, etcs.

I have found an example project in here and it seems to be exactly what i need:

In the other hand we also would like to allow users to sign up with SOCIAL / GMAIL / ( and other options as long as they provide the user email ), but i can’t find reference regarding how to add those buttons on my UI and what functions needs to be called in that case.

I believe in this case a Google / Facebook / […] pop up or new tab would show up, as those screens can not be customised right? ( also we wouldn’t want to customise every possible screen anyway, only customising the manual sign up with email/password is enough for now )

Thank you very much for your help.

#3

Unless you have a strict requirement for embedded login, I would recommend using redirect-based universal login, as it easier to secure and will take significantly less development time from your side. We have a react SDK that makes it a breeze.

If you do want to go down the rabbit hole of embedded login, look at this library:

I wouldn’t use that sample. It is 5+ years without an update and is likely not secure.

You can add social with auth0.js. I think you will still have to add the buttons and UI yourself.

That is correct, you cannot customize the UI from these social IDPs, they host their login pages. (In fact, you don’t want to customize them. Their standardization is part of why we trust them.)

#4

That sounds interesting, what if i already have a database with users and hashed passwords ( i.e. we got an application using meteor ) ?

How do i setup auth0 to check the passwords using the same encryption on the email ( i believe meteor is sha256 ) and what if a user tries to login with Google or Facebook but they’re already registered?

Also, if the user decides to sign up using email / password ( as opposed to social logins ) can i only allow the login to happen after confirming the email?

Apologies for so many questions, but i’m on the same case as tech9 and the documentation for auth0 is so extensive i’m finding easy to get lost.

Thank you !

#5

Hello, sorry I am not a developer, only an entrepeneur trying to improve the look&feel of my Auth0 Login Page.

My question is how can I include “OR” between de Auth0 with email and Social Connectiosn? Please see my current login page

#6

You have a couple of options here:

  • You can import your users (including password hashes).
    • This option requires some initial migrating development time, but after it is completed there is very little you will have to manage, and you can always export later if needed.

OR

  • You can point auth0 to your existing database.
    • This requires a paid subscription, and you will have to maintain your database infrastructure and integration, but you wont need to migrate your users and hashes.

This will depend on whether you import your users (yes, we support SHA256) or integrate with a custom database. Here are resources for the two different options.

OR

You can set up account linking. So a verified email from either social provider will be linked.

You can force email verification in a rule. Essentially they can login, then you can deny access to your app until they are verified. This is a common flow.