Firebase Simple login provides an email/password option, how do I use it? Starting from from creating a user, storing data for that user, to logging them in and out.
If you haven't yet connected your app to your Firebase project, do so from the Firebase console. Enable Email/Password sign-in: In the Firebase console, open the Auth section. On the Sign in method tab, enable the Email/password sign-in method and click Save.
Enable Email Link sign-in for your Firebase projectOn the Sign in method tab, enable the Email/Password provider. Note that email/password sign-in must be enabled to use email link sign-in. In the same section, enable Email link (passwordless sign-in) sign-in method. Click Save.
Using Firebase requires that you as the developer have a Google account. But your app's users don't need to have a Google account, unless you want them to. In fact, if you don't use Firebase Authentication, you can work with completely unidentified users for most services.
There are three distinct steps to be performed (let's assume you have jQuery):
1. Set up your callback
var ref = new Firebase("https://demo.firebaseio-demo.com"); var authClient = new FirebaseAuthClient(ref, function(error, user) { if (error) { alert(error); return; } if (user) { // User is already logged in. doLogin(user); } else { // User is logged out. showLoginBox(); } });
2. User registration
function showLoginBox() { ... // Do whatever DOM operations you need to show the login/registration box. $("#registerButton").on("click", function() { var email = $("#email").val(); var password = $("#password").val(); authClient.createUser(email, password, function(error, user) { if (!error) { doLogin(user); } else { alert(error); } }); }); }
3. User login
function showLoginBox() { ... // Do whatever DOM operations you need to show the login/registration box. $("#loginButton").on("click", function() { authClient.login("password", { email: $("#email").val(), password: $("#password").val(), rememberMe: $("#rememberCheckbox").val() }); }); }
When the login completes successfully, the call you registered in step 1 will be called with the correct user object, at which point we call doLogin(user)
which is a method you will have to implement.
The structure of the user data is very simple. It is an object containing the following properties:
email
: Email address of the user id
: Unique numeric (auto-incrementing) ID for the user
FirebaseAuthClient will automatically authenticate your firebsae for you, not further action is required. You can now use something like the following in your security rules:
{ "rules": { "users": { "$userid": { ".read": "auth.uid == $userid", ".write": "auth.uid == $userid" } } } }
This means, if my User ID is 42, only I can write or read at example.firebaseio-demo.com/users/42
- when I am logged in - and no-one else.
Note that Simple Login does not store any additional information about the user other than their ID and email. If you want to store additional data about the user, you must do so yourself (probably in the success callback for createUser
). You can store this data as you normally would store any data in Firebase - just be careful about who can read or write to this data!
Just incase someone is reached to this thread and looking for some example application using the firebase authentication. Here are two examples
var rootRef = new Firebase('https://docs-sandbox.firebaseio.com/web/uauth'); ...... ..... ....
http://jsfiddle.net/firebase/a221m6pb/embedded/result,js/
http://www.42id.com/articles/firebase-authentication-and-angular-js/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With