Detailed Demo

RemAuth API Call Flows

The 3 views of the following figure (cf. radio buttons below) summarize the operation and the interactions of RemAuth with a Service Provider and various user devices. Each orange arrow matches an API endpoint.

Step-by-Step Demo

To illustrate the way RemAuth works, we have defined in the Customer Center a basic Demo service, as you could do by yourself, which relies on RemAuth as main authentication system, including session management (extended functions).

Step Explanations Demo
1
To get an access token /access

The access token with limited lifetime is a security parameter for the endpoints designed to be requested from web or application clients.

RemAuth proposes libraries to simplify the transmission of parameters between the server and the client sides.

For the current page, the access token which expires on is obtained from the key that defines the Demo service. If you reload this page, you will see that the token and the expiration time change.

2
To authenticate a user /authenticate

The authentication endpoint has several options to customize the RemAuth authentication service:

  • Enable on-the-fly registration.
  • Customize authentication time.
  • Select authentication method(s).
  • Customize device ID and session time.
  • Enable biometric checking for the RemAuth Control application.
Real time notification

As the user authentication occurs after an undefined time, RemAuth includes several event notification mechanisms for both servers (callback) and the originating client (web socket) as it is the case in this demo.

Also, all the exchanges with the RemAuth Control application are made in real time in order to provide a better quality of service than email or SMS.

Please enter your email address to simulate a login to the Demo service. If you are not yet registred, at your first attempt you will receive a registration email. Then, you will be able to log in to Demo by email, by RemAuth Control application or by SMS.

OK

You can directly check the authentication result on step 4 thanks to the authenticate method of the JavaScript library which takes care of chaining step 3.

2'
Variant: To authenticate by QR-code /qr

With this method, the user does not even need to enter his/her email address to login. He/she just has to scan a QR-code with the RemAuth Control application which will associate the required email address.

It is the /qr API endpoint which generates the single-use and limited lifetime QR-code.

Successful scanning notifications work exactly in the same way as the basic authentication (callback and web socket).

N.B. The RemAuth JavaScript library includes methods to display and to refresh RemAuth QR-codes in web pages and popups.

AUTHENTICATE BY QR-CODE

You can directly check the authentication result on step 4 thanks to the popupQR method of the JavaScript library which takes care of chaining step 3.

3
To check the status of an authentication request /authenticated

This step is usually triggered by an event (web socket or callback) which changes the status of an authentication process. If successful, the authentication data contain a session identifier used in the following steps.

Session data as displayed in the next step are issued from this step.

4
To check session status /session/check

This operation is typically performed on page load.

The user is currently logged to Demo with the session ID used from the device identified by the code No ongoing session.

5
To stop a session /session/stop

After this step, the authentication must be renewed to login.

To leave the current session, please click the button below.

STOP THE SESSION

The demo code

RemAuth libraries

The authentication user interface is developed using the RemAuth open source libraries, based on jQuery. You will also find in this repo the source code of the following authentication examples:

The sequence of the 5 steps of the previous demo lies in the following code.

Loading libraries and access token in HTML


                    

JavaScript code

The following code contains all the elements of the JavaScript demo above. You can get the HTML and CSS layout from the source code of the current page.