Skip to main content

Authentication library

Our authentication library can be used independently of the debate space. If you want to integrate our user system into your own platform, use this library. If you have already installed the debate space, you can skip point 1, as the library is included in our code.

The library is written in React, and the code for the main component is available here.

Before you start​

  • If the Logora team has not created an administration space for you, create your Logora administration space: Sign up
  • Make sure you have your application name available on your administration space in the tab Settings > General .

1. Installing the library​

The library is supplied in the form of a Javascript file that you can insert on your website.

Insert this script into your page, along with a container logora_app.

The logora_app container is where the registration path will be displayed. Registration and login are displayed as a popup, so it won't affect the layout of the page. Standard code to copy/paste and complete: 

<!-- Insert the following scripts in the <head> tag, as high up in the page as possible -->
<script>
    // Configuration variables, the application name is present in your administration space
    var logora_config = {
        shortname: "APPLICATION_NAME"
    };
</script>
<script src="https://cdn.logora.com/auth.js"></script>
<!-- Insert this tag anywhere on the page -->
<div id="logora_app"></div>

2. Using the library​

Once the library has been inserted, authentication can be triggered using a Javascript event named logora:authentication:require :

Here is an example of the code used to trigger the event:

window.dispatchEvent(new Event("logora:authentication:require"));

The user will then be presented with a window in which to log in or begin the registration process. The authentication method depends on the settings chosen in your administration area.

Once authentication is complete, the user will be redirected to the page on which they started the process.

3. Login event​

An event is triggered when the user is successfully logged in. This event returns information about the logged-in user.

window.addEventListener("logora:authentication:success", event => console.log(event.detail.user));

Here is a preview of the user object:

{ "first_name": "Jean", "last_name": "Dupont", "image_url": "https://image.com/my-image", "points": 100 }

4. Logout event​

An event is triggered when the user logs out. It does not return anything.

window.addEventListener("logora:authentication:logout");

5. Authentication request​

When a user is asked to authenticate, an event is triggered. This event can be used to show the user your own login modal. It returns the URL to redirect to after login.

window.addEventListener("LOGORA::authenticationRequired", event => console.log(event.detail.redirectUrl));