Getting Started with Technical Development Partners

In this document, you will find detailed steps to become a YCloud technology development partner.

Basic Terminology

Before proceeding, you need to understand the following terms to better grasp the entire process of becoming a technology development partner:

Solution Partners (BSP)

BSPs are Meta business partners that provide comprehensive WhatsApp Business Platform services to other businesses, such as messaging services, billing, integration support, and customer support.

Solution partners have credit lines that they can extend to the businesses they bring in, so those businesses don't have to enter their own payment methods during onboarding. Additionally, solution partners can get direct support.

YCloud is a BSP.

Tech Providers

Tech Providers are similar to BSPs in that they can also provide comprehensive WhatsApp Business Platform services to other businesses, either on their own or in partnership with an existing BSP.

However, unlike BSPs, Tech Providers do not have credit lines. Instead, businesses brought in by Tech Providers must provide their own payment methods after onboarding. Meta will then charge those businesses for API usage, while the tech providers will charge for other services.

Moreover, tech providers cannot get direct support.

Technology Development Partner

A type of partner on the YCloud platform that integrates with YCloud to gain full access to WhatsApp-related APIs.

Each technology development partner must first become a Meta-certified Tech Provider.

Billing is provided by YCloud, and business clients do not need to connect to Meta for payments. Technology development partners need to charge their business clients for API usage and then pay YCloud.

YCloud provides support to technology development partners.

Embedded Signup

Embedded Signup is an authentication and authorization interface that automatically creates all required WhatsApp assets for your business clients and authorizes your application to access these assets.

The branding of both BSPs and Tech Providers will appear in the Embedded Signup process.

Step 1: Submit Partnership Application

Visit the YCloud partner page to submit the application form: https://www.ycloud.com/zh/partner

The YCloud business team will contact you within 1 working day.

Step 2: Register for a YCloud Account

Before you get started, you need to register for a YCloud account and inform the YCloud business team of the email address you used. We will enable the technology development partner permissions for you.

Registration link: https://www.ycloud.com/console/#/entry/register

Step 3: Become a Meta Tech Provider

Please refer to Get Started for Tech Providers and complete the following steps on the Meta platform:

Step 1: Create a Business Portfolio

Step 2: Create a Meta App

Step 3: Add the WhatsApp Product

Step 4: Test Business Messaging on WhatsApp

Step 5: Scale your solution

Step 6: Complete Business Verification

Step 4: Create Partner Solution

Go to the Meta App Dashboard > WhatsApp > Partner Solutions panel and click the Create a partner solution button.

Use the YCloud application ID to complete the process.

Enter your company name in the Solution name field;

Enter 2892949377516980 in the Partner App ID field;

After submission, wait for the YCloud team to review.

Once approved, a Solution ID will be generated and you will be notified via email or BM.

Step 5: Configure Embedded Signup

Prerequisite: Facebook Login for Business requires public_profile advanced access permissions. Please go to Meta App Dashboard > App Review > Permissions and Features to request these permissions.

Next, complete the following steps in order:

Step 1: Load the Facebook JavaScript SDK

Step 2: Create Facebook Login for Business Configuration, and set up Client OAuth settings.

Step 3: Set up Facebook Login, and refer to Configuring Embedded Signup to configure the Solution ID

Step 4: Create a Login Button

Step 5: Session Logging

Complete web page code example:

<html>
 
<head>
  <meta charset="utf-8"/>
  <script>
    window.fbAsyncInit = function () {
      // JavaScript SDK configuration and setup
      FB.init({
        appId: '{YOUR-FACEBOOK-APP-ID}', // Facebook App ID
        cookie: true, // enable cookies
        xfbml: true, // parse social plugins on this page
        version: 'v18.0' //Graph API version
      });
    };
 
    // Load the JavaScript SDK asynchronously
    (function (d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) {
        return;
      }
      js = d.createElement(s);
      js.id = id;
      js.src = "https://connect.facebook.net/en_US/sdk.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
 
    // Facebook Login with JavaScript SDK
    function launchWhatsAppSignup() {
      // Launch Facebook login
      FB.login(function (response) {
        if (response.authResponse) {
          const code = response.authResponse.code;
          console.log('User authResponse code:', code);
          // The returned code must be transmitted to your backend,
          // which will perform a server-to-server call from there to our servers for an access token
        } else {
          console.log('User cancelled login or did not fully authorize.');
        }
      }, {
        config_id: '{YOUR-CONFIGURATION-ID}',
        response_type: 'code',    // must be set to 'code' for System User access token
        override_default_response_type: true, // when true, any response types passed in the "response_type" will take precedence over the default types
        extras: {
          sessionInfoVersion: 3,
          setup: {
            solutionID: '{YOUR-SOLUTION-ID}'
          }
        },
      });
    }
 
    const sessionInfoListener = (event) => {
      if (event.origin == null) {
        return;
      }
      
      // Make sure the data is coming from facebook.com
      if (!event.origin.endsWith("facebook.com")) {
        return;
      }
      
      try {
        const data = JSON.parse(event.data);
        if (data.type === 'WA_EMBEDDED_SIGNUP') {
          // if user finishes the Embedded Signup flow
          if (data.event === 'FINISH') {
            const {phone_number_id, waba_id} = data.data;
            console.log("Phone number ID ", phone_number_id, " WhatsApp business account ID ", waba_id);
          }
          // if user reports an error during the Embedded Signup flow
          else if (data.event === 'ERROR') {
            const {error_message} = data.data;
            console.error("error ", error_message);
          }
          // if user cancels the Embedded Signup flow
          else {
           const {current_step} = data.data;
           console.warn("Cancel at ", current_step);
          }
        }
      } catch {
        // Don’t parse info that’s not a JSON
        console.log('Non JSON Response', event.data);
      }
    };
    
    window.addEventListener('message', sessionInfoListener);
 
  </script>
</head>
 
<body>
<button onclick="launchWhatsAppSignup()"
        style="background-color: #1877f2; border: 0; border-radius: 4px; color: #fff; cursor: pointer; font-family: Helvetica, Arial, sans-serif; font-size: 16px; font-weight: bold; height: 40px; padding: 0 24px;">
  Launch Embedded Signup
</button>
</body>
 
</html>

Note

  1. Please replace the appId, config_id, and solutionID in the example code above with actual values.

  2. The frontend should transmit the waba_id and phone_number_id obtained to the backend to retrieve WABA and register numbers, as detailed below.

More related references:

Step 6: Retrieve WABA and Register Numbers

After the customer completes the Embedded Signup, your frontend will obtain waba_id and phone_number_id and pass them to the backend for subsequent API calls.

Retrieve the WABA

Call the YCloud Retrieve a WABA API to get the WABA details and associate it with the customer account in your system.

Request example:

curl 'https://api.ycloud.com/v2/whatsapp/businessAccounts/{waba_id}' \
-H 'X-API-Key: {{YOUR-API-KEY}}'

Success response example:

{
  "id": "{waba_id}",
  "name": "WABA name",
  "accountReviewStatus": "APPROVED",
  "paymentMethodAttached": true,
  "currency": "EUR",
  "timezoneId": "1"
}

Note: The paymentMethodAttached response field being true indicates that YCloud has successfully associated a payment method with this WABA, otherwise, please contact the YCloud team to resolve the issue.

Register a Phone Number

Call the YCloud Register a phone number API to register the number. A successful response with HTTP status 200 indicates success.

Generally, after the number is successfully registered, its status will change from PENDING to CONNECTED, and the number can then be used to send messages.

Request example:

curl -XPOST 'https://api.ycloud.com/v2/whatsapp/phoneNumbers/{waba_id}/{phone_number_id}/register' \
-H 'X-API-Key: {{YOUR-API-KEY}}'

Success response example:

{
  "phoneNumber": "+8613800008888",
  "wabaId": "{waba_id}",
  "verifiedName": "Phone number name",
  "qualityRating": "GREEN",
  "messagingLimit": "TIER_250",
  "status": "CONNECTED"
}

Step 7: Integrate WhatsApp API Capabilities into Your Own Application

As a YCloud technology development partner, you will be able to use direct APIs to manage the WABA and phone numbers of clients you onboard. You will also receive webhooks for messages sent to these numbers.

Configure Webhook

Please refer to YCloud Configure Webhooks to subscribe to all WhatsApp-related events (prefixed with whatsapp.) and integrate them into your system.

More API References

WABA related APIs: https://docs.ycloud.com/reference/whatsapp-business-accounts

Message related APIs: https://docs.ycloud.com/reference/whatsapp-messages

Phone number related APIs: https://docs.ycloud.com/reference/whatsapp-phone-numbers

Template related APIs: https://docs.ycloud.com/reference/whatsapp-templates

API request and webhook push examples: https://docs.ycloud.com/reference/examples

Step 8: App Review

When your Meta App is in Development mode, only test users (see App Dashboard > App roles > Roles / Test users) can go through the embedded signup process. To make it available to everyone, you need to switch the mode to Live and complete the App Review.

Click Review app settings to check your saved settings and ensure an app icon, privacy policy URL, and app category have been selected before you start the application review.

Lastly, your app must undergo App Review and obtain Advanced Access approval for any permissions required by the app.

App Review Tips

As part of the review process, you must provide separate text descriptions and videos for each permission requested. Follow these guidelines when creating the descriptions and videos.

Note that you must submit different videos for each permission. Submitting the same video multiple times will result in your submission being rejected.

Start the App Review Process

You can start the App Review process in the App Dashboard:

App Dashboard> WhatsApp >Quick Start>Continue Onboarding (button)>Start App Review (button)

For more details, refer to:

Step 9: Go Live

Once everything is ready, you can inform your business clients on how to use it.

FAQ

How to determine if the embedded signup configuration is correct?

You have configured the solution ID, and the customer will see the real name corresponding to the Solution Partner when authorizing on Facebook; if not, the configuration has not taken effect. Make sure to complete the App Review.

Under what circumstances might YCloud be unable to associate a payment method with the WABA?

The user may have selected an existing WABA rather than a new one, and the existing WABA may have an unresolved payment method.

Embedded Registration Error: App not active

When opening the embedded registration page, it prompts:

App not active

This app is not currently accessible and the app developer is aware of the issue. You will be able to log in when the app is reactivated.

When app mode is Development, only test users (Listed at App Dashboard > App roles > Roles / Test users) can embed the flow.

To solve this, switch app mode to Live (To access the App Dashboard, go to Meta Apps and click on the name of the app you'd like to configure.), or assign permissions to users (See Assign business assets to people in your business portfolio).

Embedded Registration Error: Feature unavailable

When opening the embedded registration page, it prompts:

Feature unavailable

Facebook Login is currently unavailable for this app as we are updating additional details for this app. Please try again later.

Please apply for public_profile advanced access in the App Dashboard > App Review > Permissions and Features.

Embedded Registration Error: It looks like this app isn't available

Check whether the embedded registration code configuration, such as config_id, is correct.

Last updated