Authorization

Authorization is the process of asking customers to authorize access to their third-party accounts.

Unified provides several options to accomplish this, from easy 1-line embedded components to a full-featured API, and even CNAMEd domains.

Embedded Authorization Component

Unified.to provides a suite of pre-built front-end authorization components that support React, Angular, Vue, and Svelte (and plain JavaScript) for you to use in your app.

These authorization components display a list of your activated integrations, returned directly from our API. Once the end-user clicks on an integration, they will be redirected to the authorization page for that integration, regardless if it is OAuth2, API Token and any other type of authorization. in their File Storage connection.

Instructions

To use any one of these components in your app:

• Make sure you've activated some integrations first. You can do so at app.unified.to/integrations.
• On app.unified.to, click on Embedded components and select which of the widgets you want to use from the tab.
• Configure how you want the component to behave under the Configuration tab.
• View and copy the code to add to your app under the Embedded Code tab.
• Important: Under the Options tab, be sure to select the correct permissions scopes that the integrations you activated are expecting to receive. By leaving these options blank, Unified.to will request access to all possible scopes. To learn more about scopes, see: Understanding scopes.

Front-end Frameworks

Manually Authorizing Connections

If you do not want to use our pre-built authorization components, nor want to copy our component source code and make changes, then you can use our API

This is the flow to follow in your application with your end-user:

1. You redirect your user to our authorization URL. Make sure to include a success_redirect, failure_redirect, and permissions. Also include either state or external_xref.
2. Your end-user will authorize the connection
3. If they cancel, then we return them to the failure_redirect
4. If they authorize the connection, we then test their API credentials to see if it has the valid permissions
5. If that fails, then we redirect them back to the failure_redirect and also include an error message with a string denoting the error
6. If it succeeds, then we redirect them to the success_redirect and add additional parameters to the URL

Successful authorization

If the authorization is successful (either via our authorization components or via the API), we redirect the user to the specified success_redirect URL and add the following URL parameters:

• id: the newly created connection ID
• state: the state value you provided
• nonce: a random nonce value
• type: the integration type of connection
• sig: a security signature to ensure that this information has not been tampered with;

Signature calculation

The signature is calculated as follows:

sig = HmacSha256(workspace.secret).update(connection.id).update(nonce).update(state).digest('hex');

Other Embedded Components

Unified also has non-authorization components that you can embed into your app. These components are:

• Sign-in: Authenticate users so they can sign into your app; info
• Public Directory: Display a list of your integration so your users can learn about your third-party API offerings; info
• FileManager: Display a list of files in a directory so your users can pick a file; info
• CalendarScheduler: Display a calendar so your users can schedule events in their Calendar connection; info
• MessagingManager: Display a list of channels/folders and messages; info