JavaScript
User Registration - login

12min
Add JavaScript user registration and login to your Parse App
Introduction
This section explains how to do a basic user registration with email verification in a JavaScript environment through Back4App.
In this tutorial, you will use Parse.User object and will learn its most important functions.
See more about Parse SDK at Parse JavaScript SDK API Reference and Parse open source documentation for JavaScript SDK.
Prerequisites
To complete this tutorial, you will need:
 A basic JavaScript app connected with Back4App or JSBin connected with our Parse API.
Note: You can use the app created in our JavaScript Install Parse SDK tutorial or use the same online environment JSBin with the setup done in the JavaScript Database Operations tutorial.
1 - Sign Up
The user sign up function is similar to the create function used in the JavaScript Database Operations tutorial, but it has some additional benefits:
Checks if the username and email are unique.
Securely hashes the password in the cloud. Not even the developer can see the user’s password.
Requires at least an username and a password. You can use the email as username if you want to.
You can open the Back4App JavaScript Sign Up Function to see the code that has already been implemented.
To make your own signUp function, you need to repeat the same steps of the create function explained in Javascript CRUD tutorial,
but call the method user.signUp instead of the save method, as shown below:
signUp.js
1   signUp();
2
3   function signUp() {
4       // Create a new instance of the user class
5       var user = new Parse.User();
6       user.set("username", "my name");
7       user.set("password", "my pass");
8       user.set("email", "[email protected]");
9  
10      // other fields can be set just like with Parse.Object
11      user.set("phone", "415-392-0202");
12  
13      user.signUp().then(function(user) {
14          console.log('User created successful with name: ' + user.get("username") + ' and email: ' + user.get("email"));
15      }).catch(function(error){
16          console.log("Error: " + error.code + " " + error.message);
17      });
18  }
1   signUp();
2
3   function signUp() {
4       // Create a new instance of the user class
5       var user = new Parse.User();
6       user.set("username", "my name");
7       user.set("password", "my pass");
8       user.set("email", "email@example.com");
9  
10      // other fields can be set just like with Parse.Object
11      user.set("phone", "415-392-0202");
12  
13      user.signUp().then(function(user) {
14          console.log('User created successful with name: ' + user.get("username") + ' and email: ' + user.get("email"));
15      }).catch(function(error){
16          console.log("Error: " + error.code + " " + error.message);
17      });
18  }
﻿
Be aware that Error 202 or Error 203 is likely to occur if you don’t change the username or the email.

The Error 209 invalid season token is also likely to occur when your browser cookies conflict
 with your Parse’s Current Session. To bypass that, clear your browser cookies or open the
 incognito mode of your browser.
To confirm that the new user is added to the database, you can access your Parse Dashboard or code the login function which will be provided ahead.
2 - Email Verification
An important feature of a sign up method email verification.
Fortunately, it is easy to configure it using Back4App. To enable email verification, login to your account, find your app and click on Server Settings.
Find the “Verification Emails” box and click on SETTINGS. Here’s how the “Verification Emails” box looks like this:
﻿
Then enable the verification by checking the box below.
If you are using the cloud environment of JSBin, then there is no need for completing this step.
﻿
By enabling this, the user’s class in your database receives one additional field: verifiedEmail.
This field is set to true when the email is verified, false if the email isn’t verified and
undefined if the user was created before this setting was checked.
In that page you can also customize the email, change the subject, the body and the sender’s email and name.
To see how the email looks like, just create an user, using the signUp function,
with an email that you can access. You should receive an email for verification.
3 - Login
The login function is very simple and just needs a password and an username to run.
You can open the Back4App JavaScript Login Function to see the code that has already been implemented.
You need to call the Parse.User.logIn method as follow:
login.js
1   logIn();
2
3   function logIn() {
4       // Create a new instance of the user class
5       var user = Parse.User
6           .logIn("myname", "mypass").then(function(user) {
7               console.log('User created successful with name: ' + user.get("username") + ' and email: ' + user.get("email"));
8       }).catch(function(error){
9           console.log("Error: " + error.code + " " + error.message);
10      });
11  }
1   logIn();
2
3   function logIn() {
4       // Create a new instance of the user class
5       var user = Parse.User
6           .logIn("myname", "mypass").then(function(user) {
7               console.log('User created successful with name: ' + user.get("username") + ' and email: ' + user.get("email"));
8       }).catch(function(error){
9           console.log("Error: " + error.code + " " + error.message);
10      });
11  }
﻿
4 - Reset Password
It’s very important to add the Reset Password option as users are likely to forget their password in the future.
The configuration for the email that will be sent in the reset password function is on the same
page as in the Email Verification step. There you can change the body and the subject of the email.
You can open the Back4App JavaScript Reset Password Function to see the code that has already been implemented.
To send the Reset Password email, just run the following code:
resetpassword.js
1   resetPassword();
2
3   function resetPassword() {
4       Parse.User.requestPasswordReset("[email protected]").then(function() {
5         console.log("Password reset request was sent successfully");
6       }).catch(function(error) {
7         console.log("The login failed with error: " + error.code + " " + error.message);
8       });
9   }
1   resetPassword();
2
3   function resetPassword() {
4       Parse.User.requestPasswordReset("email@example.com").then(function() {
5         console.log("Password reset request was sent successfully");
6       }).catch(function(error) {
7         console.log("The login failed with error: " + error.code + " " + error.message);
8       });
9   }
﻿
It’s done!
At this point, you have learned not only how to do User Registration with JavaScript apps, but also how to send email verification and password reset emails.
Updated 28 Mar 2024
Did this page help you?
Database Operations
Facebook Login