Snappt Embedded SDK — Integration Guide

The Snappt Embedded SDK lets you launch the Snappt applicant verification flow directly inside your application as a modal overlay. No redirects, no popups — just a seamless iframe experience.

Prerequisites

Before integrating, you will need the following from your Snappt account team:

Your Client ID is bound to an API key that controls which companies and properties you can access. Snappt validates every SDK request against this configuration — if your key is scoped to a single property, only that property can be used.

Domain Allowlisting

Your Client ID is configured with a list of allowed domains. The SDK will only load on pages served from those domains. Snappt validates the request's Origin or Referer header against your allowlist.

Allowed domains support:

• Exact origins — https://apply.yourcompany.com
• Wildcard subdomains — *.yourcompany.com (matches https://apply.yourcompany.com, https://staging.yourcompany.com, etc.)

Contact your Snappt account team to configure your allowed domains.

1. Add the Script

Add the following <script> tag anywhere in your HTML page. This loads the Snappt SDK and makes the global Snappt object available. No other dependencies are required.

<script src="https://enterprise-api.snappt.com/embedded/v1.0.0.js?iframe=true&clientId=YOUR_CLIENT_ID"></script>

Note: The script will not load if the clientId is missing, inactive, or if the page's origin is not in your allowed domains list. Check the browser console for errors if the SDK fails to initialize.

2. Open the Verification Flow

Call Snappt.portal.show() to launch the applicant verification flow in a modal overlay. You must provide companyShortId and propertyShortId to identify the property.

var instance = Snappt.portal.show({
  companyShortId: 'YOUR_COMPANY_ID',
  propertyShortId: 'YOUR_PROPERTY_ID',
});

Pre-filling Applicant Data (Optional)

You can pass applicant information so they don't have to re-enter it:

var instance = Snappt.portal.show({
  companyShortId: 'YOUR_COMPANY_ID',
  propertyShortId: 'YOUR_PROPERTY_ID',
  email: '[email protected]',
  firstName: 'Jane',
  lastName: 'Doe',
  phone: '5551234567',
});

Available Options

3. Listen for Completion and Close Events

The show() call returns an instance object. Use addEventListener('close', callback) to be notified when the modal closes. Your callback receives an event object with a type field indicating what happened:

instance.addEventListener('close', function (event) {
  if (event.type === 'application-complete') {
    // The applicant finished the flow.
    showConfirmation();
  } else {
    // The applicant closed the modal without completing.
    showResumePrompt();
  }
});

You do not need to poll for results. Once the applicant completes the flow, Snappt automatically returns a completion status to your PMS to unblock application submission.

4. Programmatic Control

You can control the modal directly through the instance:

instance.hide();  // Close the modal
instance.show();  // Re-open the modal

You can also remove event listeners:

function onClose(event) {
  console.log('Modal closed:', event.type);
}

instance.addEventListener('close', onClose);

// Later, if you no longer need the listener:
instance.removeEventListener('close', onClose);

Full Example

<button id="apply-btn">Start Application</button>

<script src="https://enterprise-api.snappt.com/embedded/v1.0.0.js?iframe=true&clientId=YOUR_CLIENT_ID"></script>

<script>
  document.getElementById('apply-btn').addEventListener('click', function () {
    var instance = Snappt.portal.show({
      companyShortId: 'YOUR_COMPANY_ID',
      propertyShortId: 'YOUR_PROPERTY_ID',
      email: '[email protected]',
      firstName: 'Jane',
      lastName: 'Doe',
      phone: '5551234567',
    });

    instance.addEventListener('close', function (event) {
      if (event.type === 'application-complete') {
        alert('Thank you! Your verification is complete.');
      } else {
        alert('You can resume your application at any time.');
      }
    });
  });
</script>

Error Handling

If the SDK cannot generate an applicant link (e.g., invalid property, disabled property, or access denied), an error message will be displayed inside the modal. Common errors:

Troubleshooting