End-Users, Integrations, and Connections

April 18, 2024

TL;DR

This article explains:

What integrations and connections are
How integrations and connections relate to your end-users
How to activate an integration
How to create a connection

Your application communicates with a given SaaS application through an integration. If your application needs to access a SaaS application, you need to activate the integration for that SaaS application:

Unified.to provides integrations for 160 SaaS applications, which you can see on the Integrations page:

Activating an integration

You have to activate an integration to make it available to your application. You do this by going to the Integrations page and selecting the integration for that SaaS application.

When you select an integration, you'll be taken to its page. For example, here's the integration page for Amazon S3:

Click the Activate button to activate the integration.

Connections

Your end-users are connected to integrations through connections:

For each end-user with an account on a SaaS, that end-user must authorize your application to create a connection between them and the integration for that SaaS.

Your application gets the end-user's authorization by redirecting them to a credentials page provided by the SaaS application. The end-user enters their credentials on this page, which gives permission for Unified.to access the SaaS application on the end-user's behalf with the end-user's account.

If the end-user enters the correct credentials on the credentials page, they are returned to your application via the Success URL. Unified.to then creates a connection for that user for that SaaS application. Your application access the end- user's account for that SaaS application using the connection's ID.
If the end-user fails to enter the correct credentials, they are returned to your application via the Failure URL and Unified.to does not create a connection.

How does my application get the end-user's authorization to create a connection?

To get a user's authorization to create a connection, your application presents Unified.to's Embedded Authorization component, which displays the logos of all the SaaS applications for all your application's activated integrations. For example, if you've activated the 15Five and Google Drive integrations, the Embedded Authorization component will look like this:

To authorize a connection to a SaaS application, the end-user clicks on that application's logo, which takes them to the credentials page for the SaaS application. They enter their credentials on that page and are redirected back to your application.

Unified.to has made presenting the components as simple as possible. You'll find what you need on the Embedded Authorization page. To get there, select Settings → Embedded Authorization from the menu:

Here's what the page looks like:

The Code section provides ready-made, copy-and-paste code for displaying the components for a number of different front-end frameworks, including React, Angular, VueJS, and plain JavaScript, as "API," which has some starter code for displaying the components if you're implementing in other frameworks or languages.

Just below the Code section is the End-User Preview. It shows what the authorization widgets will look like when they are presented by your application.

Create a Connection

Let's try creating a connection as a user. Choose one of the authorization widgets and click on it. In this example, I'll click on the Google Drive widget:

In the case of Google Drive, you'll be taken to the Google authentication page. If you're a regular user of one or more Google accounts, you may be presented with this view…

…or you may be prompted to enter a username and password. Either way, sign in.

Depending on the SaaS application you're connecting to, you may be presented with an additional page asking you what Unified.to should be allowed to do when it accesses your account on the SaaS application.

Google Drive presents this page:

For the purposes of this example, I checked the Select all box to authorize Unified.to to have full read/write access to all the files in the Google Drive associated with the end-user account I used to log in. Then I clicked Continue.

Once the end-user is done authorizing Unified.to to connect to the SaaS application, they are redirected to the Success URL. For the Unified dashboard, the Success URL is your Unified dashboard's Connections page, located at app.unified.to/connections. You'll see your newly-created Connection at the top of the list:

With the connection created, you can now access the SaaS on behalf of the end-user by calling the appropriate Unified.to API using the connection's ID.

The Sandbox environment

The example above showed end-user authorization in the Production environment, where clicking a component takes you through the end-user authorization process and creates a a real connection.

In the Sandbox environment, clicking an authorization widget will immediately create a connection. You'll be taken to the Connections page, where you'll see the newly created connection at the top of the list.

Summary

Your application communicates with SaaS applications through integrations. The 160+ integrations Unified.to supports are listed on the Integrations page.
You need to activate an integration for your app to use it.
Your users are connected to your application's integrations through connections. Each user needs their own connection to an integration.
Your users need to authorize each connection. They do this by clicking authorization widgets. You can get the code to display authorization widgets on the Embedded Authorization page.
You can view your application's connections on the Connections page.

Blog