Integrated Onboarding setup
With Integrated Onboarding Partners are able to create a fully integrated signup experience for clients

The Integrated Onboarding allows you to offer a completely integrated signup experience to clients. After it is implemented, the Connect Button should trigger a pop-up which the client will use to create their WhatsApp Business API account.
After the signup is completed, the client will give you permission to manage their account. This will trigger a redirect back to your application, including all necessary data about the client, which you can use to retrieve the API key on their behalf. Make sure your redirect URL is set. Otherwise the permission can not be shared and will result in a client-facing error.
Here are a few screenshots to illustrate:
Signup first page with Partner Payment
Integrated Onboarding works with both Partner Payment and Direct Payment. If Direct Payment is enabled, the client will see the credit card field in the first page.

If you have clients registered under your 360 Partner Hub before Integrated Onboarding, you can set a permission flow for them so you can manage all clients the same way. Please see how to do this here.
This can also be used by existing clients with 360 Client Hub accounts to add new phone numbers to their existing accounts.
The choice if this number will be added to an existing WABA or a new one will be available after the signup process starts.

Integrated Onboarding works best with other Partner API features. We suggest that you read the Partner API documentation carefully to understand its almost unlimited possibilities and provide the best experience possible to your customers.

patch
https://hub.360dialog.io/api/v2
/partners/{partner_id}
Set Redirect URL for your Partner Hub
After the signup is completed, the client will give you permission to manage their account. This will trigger a redirect back to your application, including all necessary data about the client, which you can use to retrieve the API key on their behalf. Make sure your redirect URL is set. Otherwise the permission can not be shared and will result in a client-facing error.
Important: To use the ConnectButton component of the 360dialog-connect-button package the redirect URL needs to match the route that has the button integrated.

You can either create your own workflow or use the React.js button component provided by 360dialog.
If you have multiple 360 Partner Hubs (one for Partner Payment and one for Direct Payment, for example), you can create different buttons for each Hub and show them to users accordingly.

Install and add the 360dialog Connect Button via npm/yarn and follow the instructions on NPMJS
npm install 360dialog-connect-button
yarn add 360dialog-connect-button
With the 360dialog Connect Button you will get the client ID, all newly permitted channel IDs as well as revoked channel IDs via a callback object that is provided to a callback function.
The button automatically handles the popup and redirect.

Process flow of permission call and redirect + API key retrieval
2.2.1 Call permissions screen
In order to receive permissions to access clients' API keys, but also to enable the sign up flow for clients the following route needs to be called:
https://hub.360dialog.com/dashboard/app/<partner-id>/permissions
The permission screen is optimized to be opened in a popup without controls and a size of 600 px (width) by 900 px (height).
2.2.2 Consuming redirect
After the client signed in or up and granted permission to one or multiple phone numbers, your redirect URL is being called with following query parameters
Parameter in query
Description
client=<client-id>
Client ID
channels=[<channel-id>,<channel-id>]
Array of channel IDs, that were being permitted during the last call to the permission page
revoked=[<channel-id>]
OPTIONAL In case the client removes permissions to one or multiple numbers during the most recent call to the permission page, the channel IDs of the newly revoked channels will be present in the query

When triggering the pop-up, you can add query parameters to pre-fill client email, name and state:
No custom parameters are allowed at this moment.

Create an API key for each shared channel and store on your system for further use.
post
https://hub.360dialog.io/api/v2
/partners/{partner_id}/channels/{channel_id}/api_keys
Create API key for a channel
Permission screen will only show after number is running, which means that the API key can be retrieved immediately after the redirect without any additional API calls.
Know the difference between different URLs:
partner_redirect_url is used for Integrated Onboarding only.
  • can only be set through API
  • should be a URL, that can be opened in a browser
webhook_url is used to receive any webhook events.
  • This is an API endpoint, that can receive POST requests.
  • can only be set through API
onboarding_deeplink is used for Embedded Signup
  • Is set through the profile section on the partner hub
  • should be a URL, that can be opened in a browser
Copy link
On this page
What does it look like?
Managing clients and adding a new number to an existing account
Building the integration
1. Set Redirect URL for your 360 Partner Hub
patch
Set Redirect URL for your Partner Hub
2. Call the permission screen and consume the redirect
Query parameters for user information
3. Create API key(s) via Partner API
post
Create API key for a channel