PingOne Recognize

Components

The diagrams below show how the PingOne Recognize Web SDK, which runs within your web app on the user’s browser, interacts with your application server and with the PingOne Recognize network.

Headless enrollment

Headless enrollment occurs when you register a user or device without a user experience; that is, without using any additional interaction or UI controls.

To do this with the PingOne Recognize Web SDK, use client-side JavaScript in your web application.

During enrollment, your web app creates a PingOne Recognize enroll symbol and establishes a connection to the PingOne Recognize Authentication Service. It then:

  1. Waits for the "begin-stream" event and sends the first face frame.

  2. Waits for the "frame-results" event and sends one more face frame.

  3. The wait will continue in a loop until either:

    1. The error event is fired which means that most likely the biometric pipeline failed, or another error stopped the process.

    2. The stop-stream event is fired which means that the biometric pipeline succeeded.

  4. Now the PingOne Recognize Authentication Service will extract the vectors of the last frame sent and perform the recognition process.

  5. Waits for the "finished" event.

Architecture diagram showing the headless enrollment flow. A User feeds into a Camera, which connects to the @keyless/sdk-web library running inside a Customer Website in a Web Browser. The library sends data to the Authentication Service, which contains the Core Low Level SDK and Biometric SDK components. The Authentication Service writes to a KMS and a Database, and passes results to the Core Backend. Blue shaded boxes indicate Web SDK components; yellow boxes indicate Keyless dependencies.

Web component enrollment

PingOne Recognize uses Web Components to be framework agnostic. These custom elements should work in any environment that supports this standard.

During enrollment, your web app loads and renders the kl-enroll web component, the component will establish a connection to the PingOne Recognize Authentication Service as soon as it is mounted, then it:

  1. Checks if the user has consented to the usage of their camera, the permission must be granted to proceed.

  2. Checks if the user is on a desktop device and has multiple cameras.

    If so, the user is asked to pick one to avoid using the wrong camera by default.

    This doesn’t work on mobile devices, which prefer the selfie camera by default.

  3. Starts sending face frames to the PingOne Recognize Authentication Service at a set framerate.

  4. Waits for the "finished" event.

Architecture diagram showing the web component enrollment flow. A User feeds into a Camera, which connects to the @keyless/sdk-web-components library running inside a Customer Website in a Web Browser. The library sends data to the Authentication Service, which contains the Core Low Level SDK and Biometric SDK components. The Authentication Service writes to a KMS and a Database, and passes results to the Core Backend. Blue shaded boxes indicate Web SDK components; yellow boxes indicate Keyless dependencies.

IDV Bridge SaaS enrollment

In this context the enrollment happens on the server-side, requiring no interaction from the user unless manually implemented by the integrator on their client. Head to IDV Bridge space for more information about this solution.

During enrollment, your back-end service will perform a POST request to the PingOne Recognize Authentication Service following these steps:

  1. Generates a new AES-GCM or AES-GCM-SIV key.

  2. Encrypts the face image with the AES-GCM or AES-GCM-SIV key.

  3. Encrypts the AES-GCM or AES-GCM-SIV key with the RSAES-OAEP-SHA-256 public key also known as IMAGE_ENCRYPTION_PUBLIC_KEY.

  4. Performs the POST request and waits for a 201 response status code.

Architecture diagram showing the IDV Bridge SaaS enrollment flow. A Customer Backend sends a request directly to the Authentication Service, which contains the Core Low Level SDK and Biometric SDK components. The Authentication Service writes to a KMS and a Database, and passes results to the Core Backend. This flow is entirely backend-to-backend with no browser or user interaction. Blue shaded boxes indicate Web SDK components; yellow boxes indicate Keyless dependencies.

Headless authentication

Headless authentication doesn’t use a user interface. It uses client-side JavaScript to authenticate the user.

Your web app creates a PingOne Recognize auth symbol and establishes a connection to the PingOne Recognize Authentication Service, then:

  1. Waits for the "begin-stream" event and sends the first face frame.

  2. Waits for the "frame-results" event and sends one more face frame.

  3. The wait will continue in a loop until either of:

    1. The "error" event is fired which means that most likely the biometric pipeline failed, or another error stopped the process.

    2. The "stop-stream" event is fired which means that the biometric pipeline succeeded.

  4. Now the PingOne Recognize Authentication Service will extract the vectors of the last frame sent and perform the recognition process.

  5. Waits for the "finished" event.

Architecture diagram showing the headless authentication flow. A User feeds into a Camera, which connects to the @keyless/sdk-web library running inside a Customer Website in a Web Browser. The library sends data to the Authentication Service, which contains the Core Low Level SDK and Biometric SDK components. The Authentication Service writes to a KMS and a Database, and passes results to the Core Backend. Blue indicates Web SDK components; yellow indicates Keyless dependencies.

Web component authentication

PingOne Recognize uses Web Components to be framework agnostic. Custom elements should work in any environment that supports this standard.

During authentication, your web app loads and renders the kl-auth web component, the component will establish a connection to the PingOne Recognize Authentication Service as soon as it is mounted, then it:

  1. Checks if the user has consented to the usage of their camera, the permission must be granted to proceed.

  2. Checks if the user is on a desktop device and has multiple cameras.

    If so, the user is asked to pick one to avoid using the wrong camera.

    This doesn’t happen on mobile devices, which prefer the selfie camera by default.

  3. Starts sending face frames to the PingOne Recognize Authentication Service at a set framerate.

  4. Waits for the "finished" event.

Architecture diagram showing the web component authentication flow. A User feeds into a Camera, which connects to the @keyless/sdk-web-components library running inside a Customer Website in a Web Browser. The library sends data to the Authentication Service, which contains the Core Low Level SDK and Biometric SDK components. The Authentication Service writes to a KMS and a Database, and passes results to the Core Backend. Blue indicates Web SDK components; yellow indicates Keyless dependencies.