1. Embed Setup

How to setup the white label integration portal for SaaS companies with SSO.
The Embed White Label Portal is all about multi-tenant! All flows generated within it are created in a multi-tenant fashion with the same mechanism as per here.

Create Embed

To create a new Embed go to the Embed page in the settings and click the Add button in the top left corner. The Embed creation dialog will then appear:
Embed dialog
There you need to specify the following fields:
  • Name - This is an internal name used only for your reference.
  • Allowed domains - You can enter one or more domains where the iframe will be allowed to be displayed. If you enter multiple domains, separate them by commas. Wildcard with * are also allowed (e.g. *.example.com).
  • Proprietary connector - Your own connector or another connector of which you already have the credentials for all your end user, so that your users don't have to fill it in (more details) - Optional
  • Sharing level - Whether flows and connector auth are shared on a per user or a per account basis (more details)
  • Ask for consent - Whether your end users should be asked for consent (for GDPR compliance) when they open the iframe for the first time (more details) - Optional
  • Consent Flow ID - The id of a flow that should be triggered each time someone consents to use the iframe (more details) - Optional
  • Group name - This is the name of the group that will be displayed in the iframe.
  • Highlighted connectors - The selected Connectors' logos will be displayed on the group in the iframe. - Optional
  • Flow ID - The ID of the Flow that should be shown in the corresponding group.
You can add more groups and Flows by clicking the corresponding buttons.
Embed is an additional product that needs to be activated for your account. Please reach out to your Locoia account manager or solutions consultant for activation.
After clicking Submit, the Embed will be saved and its secret token and iframe code will be generated. You can see both by clicking on the edit button of the new Embed in the list:
The secret token (needed for JWT) and the iframe code - ready to be copy and pasted to your app

Embed iframe

To embed the iframe in your web app, simply copy the generated iframe code and insert into your frontend code. Optionally, you can adjust the id, name, and the width and height of the iframe.
You can also make further CSS customization, you can learn more about that here:
In order to ensure that only your app can show the iframe and to connect your users' identity with the integrations they might add you have to create a JWT token which has to be dynamically passed into the {token} variable. You can see a detailed setup guide and examples on this site:
The allowed domains settings below should be used solely during the testing phase, where it's absolutely needed.
Remove it from the allowed domains once you're going to your staging or production environment as it adds a potential security risk.

Local testing

In order to open an Embed in a local html page (i.e. where the URL is a file path), you need to specify file://* in the allowed domains.

Testing on Google Sites

One can also test embedding the iframe in Google Sites. In order to allow it to open there the allowed domains need to be set to:
sites.google.com www.gstatic.com *.googleusercontent.com