Embedding Curata

To facilitate a more efficient flow and user experience for the end-customer, the Curata system can be embedded into your existing solution using an iframe.

Embedding wireframe example:

Contents

1. Preparation and embedding

2. Frame communication

3. Frame communication Statuses

1. Preparation and embedding

To embed Curata into an iframe, start by obtaining the URL for embedding in the Dynamic Link Response. The URL is defined in the “embedded” field of the response.

Next, set up an html iframe and set the source of the iframe to the above URL. See the below example:

<iframe src=”https://uatcuratanucleus.comcorp.co.za/embedded/DJdFKUa2" name=”curataFrame” />

Additional iframe attributes relating to security concepts can be implemented should you wish to do so. More information on this can be found in the next section.

2. Frame communication

The Curata system will interact with the parent/host site using the iframe postMessage concept. More information on this method can be found here: Iframes and the postMessage Method (dyn-web.com)

To consume messages from the Curata system, an event listener will need to be set up in the parent container. As follows:

window.addEventListener('message', ({ data }) => {
console.log('i got some data!', data);
});

In the example above, the “data” object is comprised of the following:

Field	Description
eventId	Indicates the type of Curata event. See section 3 below.
status	String value containing the result of the action. See section 3 below.

The host site can now take appropriate actions based on these statuses. Note these statuses will not indicate the outcome of a Curata Identification session. It is only meant to indicate progress of the process. To see the outcome of the Curata Identification process, please refer to the response provided by either the portal or your configured response endpoint.

3. Frame communication statuses

The following table lists the various states that may be returned over the post message:

curata-completed

EventID	Status	Trigger
curata-completed	success	Curata API returned valid, non-error results to ui.
	failure	?
	consent-declined	User declined consent during consent step.

EventID	Status	Trigger
curata-failure	authentication-failed	Authentication of session with Curata API from Curata UI failed.
	aborted	User aborted process.
	no-camera-access	No camera present or user declined camera access.

EventID	Status
curata-error	api	?
	general	catch-all for any critical ui exceptions.

4. Embedding Curata in mobile app WebView components

Many mobile apps require a user gesture (such as a tap) before granting access to the camera or media devices. To address this, Curata now supports a feature that enables user gestures directly within the embedded experience. By appending the gestureEnabled=1 query parameter to the embedded link, you can display a user interaction button that prompts the necessary gesture and resolves the issue. Fore example:

https://curatanucleus.comcorp.co.za/embedded/54U4Bfru?gestureEnabled=1