Web App Integration

What does the process look like?

  1. Install the keyriAPEX.js script on your login page
  2. Host KeyriQR.html from the same origin as your login page (for example, in your /public directory)
  3. Embed keyriQR.html as an iFrame on your login page in your desired div element

This does the following:

  1. The iFrame on the page displays the Keyri dynamic QR code (Widget), which listens for encrypted data coming from your mobile app and decrypts it once the data arrives
  2. After the user scans the QR code, keyriAPEX.js listens to the iframe for the user's decrypted API credentials {APIKey, APISecret, UserId}
  3. keyriAPEX.js uses this data to authenticate the user with the APEX WebSocket API to get a SessionToken
  4. It deprovisions the APIKey from step 2 in APEX's system via their WebSocket API
  5. It stores the SessionToken in localStorage
  6. It directs the user to the logged-in state

How do I use it?

Simply include the keyriAPEX.js script on your login page. After the page is loaded, instantiate the class webApex with these arguments:

  1. The div element you want the QR code to render inside
  2. The APEX API WebSocket URL
  3. The KeyriQR URL (your iframe)

Updated 08 Jun 2022
Did this page help?