I have an app registered in a business portfolio that already has a number assigned to it, and its webhooks are being received. However, when I register the new number to the app using embedded_signup
, I am not allowed to select the same portfolio, so I use another one. The portfolio is registered and verified, but the webhooks are not being received.
For embedded_signup
, I first call the FB.login()
from the SDK like this:
FB.login((response: any) => {
console.log('Login response', response);
if (response.authResponse) {
const code = response.authResponse.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
this.tenantBusinessService.setUserFacebookInfo(code, this.authService.currentTenantId ?? '').subscribe((response) => {
console.log('insert facebook user info', response);
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
},
{
config_id: '<CONFIG_ID>', // configuration ID goes here
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
scope: "business_management,whatsapp_business_management,whatsapp_business_messaging",
extras: {
feature: "whatsapp_embedded_signup",
version: 2,
sessionInfoVersion: 3
}
});
In the function setUserFacebookInfo
I retrieve the accessToken
, phone number ID, and WABA_ID
of the WhatsApp business account just registered. Then I register the number and subscribe the account to the app, in order to receive the webhooks of the profile.
const getAccessTokenUrl = 'https://graph.facebook.com/v20.0/oauth/access_token';
const getAccessTokenParams = new URLSearchParams({
client_id: client_id,
client_secret: client_secret,
code: codeToExchange
});
const accessTokenResponse = await fetch(`${getAccessTokenUrl}?${getAccessTokenParams}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${systemUserAccessToken}`,
},
});
const accessTokenResponseData = await accessTokenResponse.json();
const accessToken = accessTokenResponseData.access_token;
// get user info
const getUserInfoUrl = `https://graph.facebook.com/v20.0/debug_token?input_token=${accessToken}`;
const userInfoResponse = await fetch(getUserInfoUrl, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${systemUserAccessToken}`,
},
});
const userInfoResponseData = await userInfoResponse.json();
const userId = userInfoResponseData.data.user_id;
const whatsappId = userInfoResponseData.data.granular_scopes[1].target_ids[0];
// get phone info
const getPhoneInfoUrl = `https://graph.facebook.com/v20.0/${whatsappId}/phone_numbers?access_token=${accessToken}`;
const phoneInfoResponse = await fetch(getPhoneInfoUrl, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${systemUserAccessToken}`,
},
});
const phoneInfoResponseData = await phoneInfoResponse.json();
// register
const url = `https://graph.facebook.com/v20.0/${facebookUser.whatsapp_phone_number_id}/register`;
const body = {
messaging_product: "whatsapp",
pin: "123456"
};
const response = await fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${accessToken}`,
},
body: JSON.stringify(body),
});
// subscribe app
const subscribeToAppUrl = `https://graph.facebook.com/v20.0/${facebookUser.whatsapp_id}/subscribed_apps`;
const subscribeToAppResponse = await fetch(subscribeToAppUrl, {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${accessToken}`,
},
});
const subscribeToAppResponseData = await subscribeToAppResponse.json();
The response of register
and subscribed_app
is
{
"success": true
}
To check if the business is subscribed to the app, I use the GET API:
curl \
'https://graph.facebook.com/v20.0/<WABA_ID>/subscribed_apps' \
-H 'Authorization: Bearer EAASJB...'
and receive this response:
{"data":[{"whatsapp_business_api_data":{"link":"https:\/\/colibryx.com\/","name":"Cadena","id":"1276560010137464"}}]}
However, I am still not receiving the webhooks.
Does anyone have the same problem as me? any solution?