Numio Authenticator Integration Docs
The following documentation outlines integration instructions for a custom Numio Authenticator implementation through the Numio app.
Step 1: Register as a Verified Integration Partner ✓
Partner Application ↓
Your application contains basic information that we can use to verify that this integration satisfies your business needs.
To get started, fill out a quick application.
Step 2: Create your first integration project ↓
Once step one is complete, we will reach out and your first project will be created. This will allow you to access our end points and services.
Partner Application ↓
Your project is the application or website that contains the integration. An integration partner can have multiple concurrent projects.
After registration we will provide a unique “APP_ID” and “APP_SECRET” which is different for every website or application registered to use Numio Authenticator. These tokens will allow your application to communicate with our service.
Step 3: Learn about Numio Authenticator ↓
We strive to make integrations as painless as possible by giving you all the tools and code snippets you need to get up and running.
Numio Authenticator ↓
Our Two-Factor Authentication technology, Numio Authenticator, instantly approves sign-ins to third-party websites or applications – without the need to search through authentication codes.
High Level Overview ↓
Add a button to your website or application that triggers a modal QR code a user can scan with their secure Numio application. Upon scanning, a custom, branded screen appears in-app and asks the user to grant access using our advanced biometrics system. Upon pass/fail, the user is instantly granted access or on boarded into your application instantly.
Step 4: The Technical Overview ↓
The following outlines what happens in the user experience.
1. A user scans a QR code on your website or application through the Numio mobile app.
2. After scanning the QR code, the user is shown a custom branded in-app screen asking the user to approve the login request.
3. User approves the request and gives permission to share data with the provider. User data (which can include user basic information: email, name, numio ID and profile picture) is then Encrypted with NodeRSA (which uses RSA or Public Key Encryption) which generates a key and encrypts the user data. (User data is only sent if “Register with Numio” is enabled for the client.)
4. After the data is encrypted, it’s sent to the provider’s front-end by the Numio-CDN.
5. After receiving the token and encrypted user data, it is sent to the provider’s back-end.
6. The provider’s back-end receives the token and sends it to the SIP Server, with help of Numio-SDK, for authentication.
7. The SIP Server receives the token and determines if the sent token is valid or not.
8. If the sent token is valid, it is then decrypted with the help of NodeRSA and the generated keys (which were generated in step 3) are deleted. “return success” response is sent to the provider’s back-end.
9. If the sent token is invalid, then the response of failure is sent to the provider’s back-end.
Important Note ↓
Without the “APP_ID” and “APP_SECRET” passed with the request object, the Numio Authenticator service the return object will deny access to the integration.
Step 4: Integration Guide ↓
1. To integrate Numio Authenticator in your project you will need to install two npm packages: numio-cdn for front-end and numio-sdk for backend.
2. Before installing the packages, be sure you are registered as a verified integration partner and have the tokens for your project.
3. You will be initializing the numio-cdn on the front-end which will provide you an object.
4. You will then pass that object in the QR code generator component.
5. When a user scans that QR code with Numio app they will be asked to give permission to share the information.
6. After the user gives the permission, a token will be sent to the front-end of the website through the numio-cdn package.
7. As soon as your website front-end receives that token it will send it to your back-end where that token is authenticated with the help of numio-sdk package.
The Packages ↓
The QR Code Data Object ↓
To generate the QR code, providers can use a variety of tools. For instance, if using React, qrcode.react could be used to generate the required assets.
{
"url :"https://api-pay.numio.one/provider/8464920",
"socket_id":"A-qPUIaaQKveXd4iAALg"
}
Important Note ↓
The QR code contains the SIP Server route, provider “APP_ID” and user “SOCKET_ID”.
The “SOCKET_ID” is a unique id of each individual connection that is made to the server. “SOCKET_ID” is used to send the data for that unique connection.
In-App Custom Dialog ↓
The In-App Custom Dialog is the permission screen that is presented inside the Numio app that the user will see every time they request permission to login.
- Logo: 180×100 dimensions in PNG format.
- Provider Name: “Vault”
Access & Privacy ↓
Once the user taps the green button, the user is authenticated to your service. In the case of Vault, a notification gets triggered anytime a user gains access into the system just like a normal login.
Important Note ↓
The 3rd party service does not need to alter their database for this integration.
User Data ↓
The Numio SDK provides configuration options as to what data should be returned from the Numio app. In-scope items are:
- First Name
- Last Name
- Numio ID
- Profile Image
Integration Time ↓
With the tools provided, we anticipate this integration to take ~1 day.