iFrame Integration

Embedding the Verification iFrame

You can optionally embed the verification link returned in the response within an iFrame on your website. The iFrame will post messages to the parent window based on specific events that occur during the verification process.

iFrame Example

<iframe
  src="https://fe.dcams.app/d2568a05-47a2-4ec7-b3e3-c5bd194461a7"
  width="420"
  height="670"
  style="overflow: hidden; border: none;"
  allow="camera"
  allowfullscreen
  <!-- Make sure to set the allow properly in case one of your verification components needs access -->
></iframe>

When displaying this iFrame on a mobile device, set both width and height to 100% and include the allowfullscreen attribute so the verification experience can expand properly.

Listening for Post Messages

To listen for events sent from the iFrame to the parent window, you can add an event listener for the message event.

---

Sample Implementation

// Listen for messages from the iframe/webview
  window.addEventListener('message', function(event) {
    // Optional: Verify the origin for security
    // if (event.origin !== 'https://vx-fe.dcams.app') return;

    const message = event.data;

    switch (message) {
      case 'PASS':
        console.log('Verification successful!');
        // Handle successful verification
        // e.g., redirect user, show success message, etc.
        break;

      case 'FAIL':
        console.log('Verification failed');
        // Handle failed verification
        // e.g., show error message, allow retry, etc.
        break;

      case 'ALREADY VERIFIED':
        console.log('User already verified');
        // Handle already verified case
        // e.g., skip verification flow, show appropriate message
        break;

      default:
        console.log('Unknown message received:', message);
        // Handle any other messages or ignore
        break;
    }
  });