Browser - Keyri Widget Quickstart

1. Serve KeyriQR.html (available here) from the same origin as your login page (e.g., a /public directory)
2. RECOMMENDED: serve everything on your login's origin with the header X-Frame-Options: SAMEORIGIN (examples of how to do so here)
3. Embed an iframe in your login page in the desired DOM element with ./KeyriQR.html as its src

Now add an event listener to the iframe to listen for messages from it, processing that data however you would like. The example below assumes the mobile app is sending an auth token and places that auth token into local storage. Other options include passing the data into different functions and POSTing to your backend.

To work in a local development environment, add the following query-string to your iframe's src attribute (please note that this only works for localhost - any port is fine).

Environment=dev&Origin=your.registered.domain.com, where your.registered.domain.com is the domain with which you registered on https://app.keyri.com. Example as follows: