Passkey Ready integration

Integrate Passkey Ready into your client application to learn how many of your users are ready to adopt passkeys.

Get started by choosing your client for personalized docs.

Select client

Import

NPM

Install the Authentikit npm package:

npm i --save @passageidentity/authentikit

CDN

The CDN version of Authentikit is available at https://cdn.passage.id/authentikit.js.

Implementation

Get client side key

Passkey Ready requires the client side key for your Passage organization where you want results to be posted. This can be found on the organization settings page of Passage Console.

Organization settings page in Passage Console

Integrate into your app

NPM

For single-page apps built with tools like React, Vue, or Angular we recommend placing this code near the main app constructor or function to ensure that it executes on all pages.

Import the Authentikit class and construct an Authentikit object using the client side key.
Make a call to authentikit.passkey.evaluateReadiness() on the page load of your main app body.

App.tsx

import { useEffect } from 'react';
import { Authentikit } from '@passageidentity/authentikit'
 
function App() {
    useEffect(() => {
        const authentikit = new Authentikit({clientSideKey: 'YOUR_CLIENT_SIDE_KEY'});
        authentikit.passkey.evaluateReadiness();
    },[]);
 
    return (
        // Main app body
    );
}
export default App;

CDN

For apps built using the CDN Authentitkit script we recommend placing the code in a <script> tag inside the <head> tags on your app.

index.html

<head>
    <script type="module">
        import { Authentikit } from 'https://cdn.passage.id/authentikit.js'
        const authentikit = new Authentikit({clientSideKey: clientSideKey});
        authentikit.passkey.evaluateReadiness();
    </script>
</head>

When integrating Passkey Ready into your app, consider the environments you may be posting data from. For example, if you integrate Passkey Ready into a development or staging environment, you may end up recording results that aren't representative of your production environment.

Testing

After integrating Passkey Ready into your client application you can test the integration by visiting your app in a browser or on your mobile device. The results will be posted to your Passage organization on the Passkey Ready page in Passage Console.

Passkey Ready dashboard in Passage Console