本文为您介绍如何通过Meta官方提供的注册工具进行WhatsApp Business账号的注册。使用嵌入式注册(Embedded signup)可以大幅缩短您的注册时间,嵌入式注册简化了注册步骤,将注册的全部步骤整合到了单个流程内,从而使得注册时间可以由几天缩短至几分钟。
前提条件
在进行嵌入式注册前需要您完成以下操作:
操作步骤
Facebook开始启用新版(版本2)嵌入式注册流程,您可以使用extras对象中的version参数(可选)来控制最终用户看到的嵌入式界面(流程)版本。
版本1用于初始嵌入式注册流程,版本2用于新版嵌入式注册流程。如果未指定版本(version),最终用户将看到新版嵌入式注册流程。
如果您未指定版本或指定版本为2时(默认情况下为未指定版本),可以直接绑定WABA-ChatappBindWaba。
请注意,Facebook最终将停止对版本1的支持。更多关于操作和信息,请参见Facebook官方文档指定流程版本。
获取AppID-IsvGetAppId
在您获得ISV服务权限后,即可使用Facebook jssdk进行嵌入式操作,调用IsvGetAppId获取到操作必需的AppID信息,根据此信息可以拉起SDK进行嵌入式注册操作。
代码示例
const onRegisterButtonClick = ()=>{
const { appId , configId } = this.state;
// 初始化sdk
window.fbq &&
window.fbq("trackCustom", "WhatsAppOnboardingStart", {
appId: appId,
feature: "whatsapp_embedded_signup"
});
// sdk 回调函数
const sessionInfoListener = event => {
if (event.origin !== "https://www.facebook.com") return;
try {
const eventData = JSON.parse(event.data);
console.log("[sessionInfoListener] Event Data", eventData, event.data);
if (eventData.type === "WA_EMBEDDED_SIGNUP") {
if (
eventData.event === "FINISH" ||
eventData.event === "FINISH_ONLY_WABA"
) {
const { waba_id } = eventData.data;
console.log(
"[sessionInfoListener] waba_id",
waba_id
);
//TODO 调用Chatapp提供的ChatappBindWaba接口,此接口调用成功会返回custSpaceId,后续和之前一致
}
}
} catch {
console.log("Non JSON Response", event.data);
}
};
// 监听 message 事件
window.addEventListener("message", sessionInfoListener);
// 唤起SDK
window.FB.login(
response => {
// 此处得到的accessToken不需要再调用Chatapp提供的ChatappEmbedSignUp接口(此接口已弃用)
if (response.authResponse) {
const accessToken = response?.authResponse?.accessToken;
} else {
console.log("User cancelled login or did not fully authorize.");
}
},
{
config_id: configId,
// 从前面接口获取的configId
response_type: "code",
// response_type需要定义为code
override_default_response_type: true,
// 此参数需要定义为true
extras: {
feature: "whatsapp_embedded_signup",
featureType:"only_waba_sharing",
// only_waba_sharing 代表嵌入式可以不录入电话号码(现在Chatapp单独提供了新增电话号码接口 AddChatappPhoneNumber)
// 如果需要在嵌入式时录入电话号码,就和之前保持一致即可
version: 2,
sessionInfoVersion: 2,
// 两个版本需要定义为2
setup: {}
}
}
);
}
// Example Button
<button onclick="launchWhatsAppSignup()">Login with Facebook</button>;
Facebook嵌入式具体操作请参考嵌入式注册流程。
接口文档
示例
正常返回示例(JSON格式)
{
"RequestId": "744c4b5c79c9432497a075bdfca3***",
"Code": "OK",
"Message": "null",
"AppId": "23h***",
"ConfigId":"3548941223****"
}
绑定WABA-ChatappBindWaba
通过Facebook JSSDK进行嵌入式注册完成后,在监听的message事件中,可以得到wabaId,将wabaId传入ChatappBindWaba接口,平台会将wabaId和您在阿里云的PID做关联并返回唯一标识:custSpaceId,在后续接口操作中需要此参数作为约束。
接口文档
示例
正常返回示例(JSON格式):
{
"RequestId": "90E63D28-E31D-1EB2-8939-A948664****",
"Code": "OK",
"Message": "无",
"Data": {
"CustSpaceId": "C0202939293****",
"WabaId": "29398*****"
}
}
查询WABA商业信息-QueryWabaBusinessInfo
通过调用当前接口,获取通过嵌入式授权的Facebook Business平台的WABA商业信息。
接口文档
QueryWabaBusinessInfo - 查询waba商业信息
示例
正常返回示例(JSON格式):
{
"RequestId": "90E63D28-E31D-1EB2-8939-A948664****",
"Code": "OK",
"Message": "无",
"Data": {
"BusinessId": "19288282****",
"BusinessName": "Alibaba****",
"VerificationStatus": "verified",
"Vertical": "零售"
}
}