Configuring LoginRocket

LoginRocket is a set of features within AuthRocket to help you start processing logins and signups in record time. It includes both Hosted Logins and Signup and authrocket.js.

See Handling Logins and Handling Signups for overviews.

Setting up LoginRocket

LoginRocket must be enabled for either hosted logins/signups or authrocket.js.

Start by going to the realm you’re working with, then to Settings and LoginRocket.

If LoginRocket doesn’t yet exist, you will be prompted to create it. Do so.

You’ll see a section for Logins and a section for Signups. If you want to use LoginRocket for logins (hosted or authrocket.js), make sure that checkbox is selected.

Likewise, if you want LoginRocket to help with signups (again, hosted or authrocket.js), select that checkbox. For signups, you’ll also choose whether you want AuthRocket to create complete User records upon signup, complete User records with an Org and Membership, or just Signup Tokens. See Handling Signups for more.

Additionally, you can instruct LoginRocket about certain fields that will be on the signup form.

  • Names (first_name + last_name) - Whether these fields are required, asked for (but allowed to be left blank), or not shown.
  • Passwords - Whether the password field will be shown once, or twice (the traditional password + confirm password combination).
  • Organization (org_name) - Whether the organization field is required, asked for (but allowed to be blank), or not shown. If blank or not shown, the org will be named after the user.

Setting up the Passwords Auth Provider

Go to Realm -> Settings -> Auth Providers.

Typically the Passwords Auth Provider already exists. If not, add it. Otherwise, click on it to edit it.

Here you can adjust the minimum password strength. For production applications, we recommend a minimum length of at least 8. If you app has any kind of sensitive data, consider setting the minimum complexity to Medium or even High.

Setting minimum complexity to insecure allows simple passwords, but will cause LoginRocket to still show a password strength meter. Setting to disabled turns off the strength meter entirely.

Creating a Connected App

Next, you’ll need to setup one or more Connected Apps. Most apps will need just one. Adding more than one Connected App is usually used in single sign-on scenarios.

Go to Connected Apps -> Add App.

Name
If using Hosted logins or signups, the name field will be used as a primary header on each page. Otherwise, it’s just for your reference.

Subdomain
Subdomain will be automatically generated if left blank. Or, enter a subdomain that’s related to your app or company name. This will become the URL for hosted logins and signups (unless you add a custom domain later).

Login handler URL
The Login Handler URL is the URL of your app where logins will be processed. After a user logs in, they will be automatically redirected to this URL. At this URL, your app should be prepared to receive the user’s login token, validate it, and setup a new session for your user. See our Full Start Guide for more.

When using Signups with Users (not Signup Tokens), AuthRocket will automatically create the new User, log them in, and then send them to the Login Handler URL with a login token and &signup=true added to the URL.

For development purposes, it’s valid to use localhost and/or a port number, for example: http://localhost:3000/login or http://localhost:8080/signup. For production, please use https.

Signup token handler URL
If LoginRocket is instead configured to create Signup Tokens for signups, the Signup Token Handler URL is where your app will process signups. When a user initiates a signup, they will be automatically sent to this URL. At this URL, your app should be prepared to receive the Signup Token and Create a User using that Signup Token.

This may be left blank if not using Signups with Signup Tokens.

Signup Token mode allows your app to also process other data during the signup process. For example, you might also collect plan or payment information. With authrocket.js, this information can even be collected on the same form. Often it will make sense to validate this other information first, and only if it’s good (for example, payment information is confirmed as valid) is the Signup Token used to create a User.

Customizing LoginRocket

If you want to customize the visual look of the hosted pages now, click Configure near the bottom. You can always come back later as well. See Customizing LoginRocket for more.

Using Hosted Logins

Next, go to Realm -> Integration. Near the bottom is the LoginRocket URL. Redirect (or link) your users to this URL to login. If you want to ensure users always see the login form, add /login to the end (eg: https://sample.e1.loginrocket.com/login).

If you have more than one Connected App, you can choose between them. This enables you to view the correct URL for each Connected App.

Using Hosted Signups

The same LoginRocket URL works for hosted signups too. To send users directly to the signup form (without needing to click a link from the login form), add /signup to the end (eg: https://sample.e1.loginrocket.com/signup).

Connecting to authrocket.js

To configure authrocket.js, simply tell it your LoginRocket URL. For example:

AuthRocket.setInstanceUrl("https://sample.e1.loginrocket.com/");

As above, if you have more than one Connected App, select the proper one to view the correct URL for each Connected App.

Questions? Find a Typo? Get in touch.