Skip to content
Guides
/
/
Embedding BNDRY Automatio...
Last updated

Embedding BNDRY Forms & Automations

BNDRY provides flexible options for integrating our data collection forms into your application. You can choose to redirect users to our hosted forms or embed them directly within your app using iframes.

Overview

When embedding BNDRY forms, you have two primary options:

  1. Hosted Forms: Redirect users to BNDRY's hosted data collection forms and automations. Requires minimal development effort. BNDRY offers a light theming option to match your brand's look and feel.

  2. Embedded Forms: Embed the forms directly within your application using an iframe. This allows for a more seamless user experience, as customers can complete the forms without leaving your site.

Hosted Forms

To use BNDRY's hosted forms, simply redirect your users to the redirect_uri provided in the response when you run an automation job via the BNDRY API. This approach requires minimal development effort and allows you to leverage BNDRY's secure and compliant data collection infrastructure.

Embedded Forms

We recommend using the MIT-licenced @open-iframe-resizer package to embed BNDRY forms within your application. This package enables automatic resizing of the iframe to fit the content, providing a seamless user experience with no scrollbars.

Usage example:

At it's simplest, import the module and initialise your iframe by ID.

You'll receive the redirect_uri for the iframe src attribute from the BNDRY API when running an automation job.

We've also included the necessary sandbox and allow attributes below for optimal functionality.

<script type="module">
  import { initialize } from "https://cdn.jsdelivr.net/npm/@open-iframe-resizer/core@v2.0.0/dist/index.min.js";

  initialize({}, "#bndry-integration");
</script>

<iframe
  id="bndry-integration"
  src="{{redirect_uri}}"
  sandbox="allow-same-origin allow-scripts allow-forms allow-modals"
  allow="camera; clipboard-write;" />

Notes:

  • Ensure that the iframe id used in the initialize function matches the id attribute of your iframe element.
  • The redirect_uri should be dynamically set based on the response from the BNDRY API when you initiate an automation job.
  • The sandbox attribute is configured to allow necessary permissions for BNDRY forms, including camera access for document capture.
  • The allow attribute grants specific permissions required for the forms to function correctly.
  • Refer to the @open-iframe-resizer documentation for React, Vue and advanced configuration options.
Previous page
Next page