Request recognition frame

The PingOne Recognize Web SDK can return the recognition frame when PingOne Recognize authentication or enrollment actions succeed.

The recognition frame is a JPEG image at 80% quality.

Headless integration

To request the recognition frame without using a user interface:

Start with one of the baseline integrations:
- For authentication, use Headless authentication integration.
- For enrollment, use Headless enrollment integration.
Include the includeRecognitionFrameHash: true property in the jwt options when calling createKeylessAuth or createKeylessEnroll:
```
const auth = createKeylessAuth({
  ...,
  jwt: {
    includeRecognitionFrameHash: true
  }
})
```

Add an event listener to the success event of your authentication or enrollment symbol:

addKeylessEventListener(auth, 'success', (event) => {
  // will log the base64 recognition frame
  console.log(event.recognitionFrame)

  // will log the JWT, the JWT includes the recognition frame hash
  console.log(event.jwt)
})

Web component integration

To request the recognition frame using web components:

Start with one of the baseline integrations:
- For authentication, use a Web component authentication integration.
- For enrollment, use a Web component enrollment integration.

Add a request-recognition-frame attribute to your web component:

<kl-auth-or-enroll
  ...
  request-recognition-frame
></kl-auth-or-enroll>

Add an event listener to the success event of your web component:

auth_or_enroll.addEventListener('success', (event) => {
  // will log the base64 recognition frame
  console.log(event.detail.recognitionFrame)

  // will log the JWT, the JWT includes the recognition frame hash
  console.log(event.detail.jwt)
})