Quickstart: Embedded Flow

Verifying individuals with the Embedded Flow can be easily achieved with a short code snippet. You'll only need your template ID which can be found in the Integration Section of your Dashboard.

Embedding the flow

Persona can be integrated with the following code snippet. Remember to replace templateId with your organization's template ID.
Inquiry SDK latest

<script src="https://cdn.withpersona.com/dist/persona-vX.Y.Z.js"></script>

<script>
  const client = new Persona.Client({
    templateId: "tmpl_JAZjHuAT738Q63BdgCuEJQre",
    environment: "sandbox",
    onLoad: (_error) => client.open(),
    onComplete: inquiryId => {
      // Inquiry completed. Optionally tell your server about it.
      console.log(`Sending finished inquiry ${inquiryId} to backend`);
      fetch(`/server-handler?inquiry-id=${inquiryId}`);
    }
  });
</script>

Or you can also use optional callbacks for advanced Event Handling.

<script>
  const client = new Persona.Client({
    templateId: "tmpl_JAZjHuAT738Q63BdgCuEJQre",
    environment: "sandbox",
    onLoad: (error) => {
      if (error) {
        console.error(`Failed with code: ${error.code} and message ${error.message}`)
      }

      client.open();
    },
    onStart: (inquiryId) => {
      console.log(`Started inquiry ${inquiryId}`);
    },
    onComplete: (inquiryId) => {
      console.log(`Sending finished inquiry ${inquiryId} to backend`);
      fetch(`/server-handler?inquiry-id=${inquiryId}`);
    },
    onEvent: (name, meta) => {
      switch (name) {
        case 'start':
          console.log(`Received event: start`);
          break;
        default:
          console.log(`Received event: ${name} with meta: ${JSON.stringify(meta)}`);
      }
    }
  });
</script>

That's it! You're done.

To retrieve information about inquiries, see /api/v1/inquiries/.

❗️
If you plan on allowing the Persona flow to be opened multiple times in a window, we recommend reusing the same Persona client each time. Reusing the client means that the client can reuse the same iframe and listeners, preventing memory leaks between clients and improving performance.