Introdução aos fluxos do WhatsApp
Fluxos do WhatsApp facilitar que as empresas coletem informações de seus usuários por meio de componentes de interface do usuário avançados no WhatsApp. Isso é muito útil para casos de uso como a captação de novos clientes potenciais, cadastros e feedback dos clientes.
Para começar a usar o WhatsApp Flows, é preciso seguir algumas etapas:
- Criar fluxo do WhatsApp - Crie sua definição do fluxo do WhatsApp no WhatsApp Manager.
- Criar modelo do WhatsApp - Se você estiver usando o WhatsApp Flow como uma mensagem iniciada pela empresa, crie um modelo do WhatsApp que dê início ao WhatsApp Flow.
- Enviar uma mensagem usando o fluxo do WhatsApp - Envie a mensagem que dará início ao fluxo do WhatsApp usando o modelo do WhatsApp criado ou como uma mensagem interativa dentro de uma janela de conversa já existente.
Criar um fluxo do WhatsApp no WhatsApp Manager
Atualmente, os fluxos do WhatsApp só podem ser criados dentro de Gerenciador do WhatsApp.
Você pode criar um novo fluxo do WhatsApp no menu WhatsApp Manager > Fluxos. Também é possível criar um novo fluxo do WhatsApp ao criar um novo modelo do WhatsApp.
No editor de fluxos, primeiro você precisará adicionar um nome ao seu fluxo e selecionar um modelo de acordo com o tipo de informação que deseja coletar:
Em seguida, edite o JSON para adicionar uma descrição e atualizar as perguntas e respostas que o usuário preencherá assim que o fluxo for enviado:
Veja o Meta documentação para obter uma lista completa dos modelos e componentes que podem ser ativados no JSON que define o fluxo.
Exemplo de fluxo e JSON
Aqui está um exemplo de um fluxo do WhatsApp e sua definição em JSON:
 |
 |
{
"version": "6.3",
"screens": [
{
"id": "edtech_leadgen_flow",
"layout": {
"type": "SingleColumnLayout",
"children": [
{
"type": "TextHeading",
"text": "Get Your Dream Education Today!"
},
{
"type": "TextBody",
"text": "Discover the best educational opportunities in your area with our expert guidance.\n\nHelp us understand your needs better by answering these 3 questions.\n\nYou will then be assigned to one of our consultants to assist you."
},
{
"type": "Form",
"name": "edtech_leadgen_form",
"children": [
{
"type":"TextInput",
"label": "Full Name",
"name": "fullname",
"required": true
},
{
"type": "RadioButtonsGroup",
"name": "educationlevel",
"label": "Interested education level",
"required": true,
"data-source": [
{
"id": "High School",
"title": "High School"
},
{
"id": "Undergraduate",
"title": "Undergraduate"
},
{
"id": "Graduate",
"title": "Graduate"
},
{
"id": "Other",
"title": "Other"
}
]
},
{
"type": "RadioButtonsGroup",
"name": "whentostart",
"label": "When do you want to start",
"required": true,
"data-source": [
{
"id": "Within 3 months",
"title": "Within 3 months"
},
{
"id": "Within 6 months",
"title": "Within 6 months"
},
{
"id": "More than 6 months later",
"title": "More than 6 months later"
}
]
},
{
"type": "Footer",
"label": "Submit",
"on-click-action": {
"name": "complete",
"payload": {
"fullName": "${form.fullname}",
"educationlevel": "${form.educationlevel}",
"whentostart": "${form.whentostart}"
}
}
}
]
}
]
},
"title": "Vonage Tuition Agency",
"terminal": true,
"success": true,
"data": {}
}
]
}
Crie um modelo do WhatsApp para iniciar o fluxo
Para enviar o fluxo do WhatsApp como uma mensagem iniciada pela empresa ao usuário, você precisaria criar um modelo do WhatsApp com um botão que iniciasse o fluxo.
Você pode usar o serviço da Vonage API de gerenciamento de modelos do WhatsApp para criar este modelo.
Aqui está um exemplo da carga útil da solicitação que cria o modelo:
{
"name": "edtech_flow_template",
"language": "en",
"category": "MARKETING",
"allow_category_change": true,
"components": [
{
"type": "HEADER",
"format": "TEXT",
"text": "Get Your Dream Education Today!"
},
{
"type": "BODY",
"text": "Hi {{1}}! Discover the best educational opportunities in your area with our expert guidance. Click the button to chat with our advisors on WhatsApp and take the first step towards your future.",
"example": {
"body_text": "[['John']]"
}
},
{
"type": "BUTTONS",
"buttons": [
{
"type": "FLOW",
"text": "Register Now!",
"flow_id": "XXXX",
"navigate_screen": "edtech_leadgen_flow",
"flow_action": "navigate"
}
]
}
]
}
Enviar uma mensagem usando o fluxo do WhatsApp
Ao enviar um Flow usando a Messages API do Vonage, você precisará enviar uma mensagem do tipo custom. Você pode enviar uma mensagem usando um modelo que contenha um fluxo ou uma mensagem sem modelo, dependendo de quando e como a conversa foi iniciada.
Como usar um modelo que contém um fluxo
Para enviar o fluxo do WhatsApp como uma mensagem iniciada pela empresa, é necessário ter criado primeiro um modelo do WhatsApp.
Aqui está um exemplo da carga útil da solicitação da Messages API para enviar o modelo do WhatsApp que iniciará o Fluxo do WhatsApp:
{
"from": "XXXX",
"to": "XXXX",
"channel": "whatsapp",
"message_type": "custom",
"custom": {
"type": "template",
"template": {
"namespace": "XXXX",
"name": "edtech_flow_template",
"language": {
"policy": "deterministic",
"code": "en"
},
"components": [
{
"type": "body",
"parameters": [
{
"type": "text",
"text": "John"
}
]
},
{
"type": "button",
"sub_type": "flow",
"index": "0",
"parameters": [
{
"type": "action",
"action": {
"flow_token": "1bd0525c-3bbe-4936-b1f2-26dca373b404"
}
}
]
}
]
}
}
}
Como usar uma mensagem que contenha um fluxo
Durante uma conversa em andamento (dentro do prazo de 24 horas), você pode enviar o WhatsApp Flow sem precisar criar um modelo com antecedência.
Aqui, você precisará incluir o flow_id do fluxo que você criou anteriormente. Este é um exemplo de solicitação ao usar a Messages API:
{
"from": "XXXX",
"to": "XXXX",
"channel": "whatsapp",
"message_type": "custom",
"custom": {
"type": "interactive",
"interactive": {
"type": "flow",
"header": {
"type": "text",
"text": "Get Your Dream Education Today!"
},
"body": {
"text": "Discover the best educational opportunities in your area with our expert guidance."
},
"footer": {
"text": "Vonage Tuition Agency"
},
"action": {
"name": "flow",
"parameters": {
"flow_message_version": "3",
"flow_token": "1bd0525c-3bbe-4936-b1f2-26dca373b404",
"flow_id": "XXXX",
"flow_cta": "Sign Up!",
"flow_action": "navigate",
"flow_action_payload": {
"screen": "edtech_leadgen_flow"
}
}
}
}
}
}
Resposta do usuário no fluxo do WhatsApp
As informações enviadas pelo usuário no seu WhatsApp Flow serão encaminhadas a você por meio do webhook da Messages API configurado. Consulte a documentação da Meta sobre o formato de resposta completo.
Aqui está um exemplo:
{
"to": "XXXX",
"from": "XXXX",
"channel": "whatsapp",
"message_uuid": "f49e93ea-4f59-47a3-a6cd-d1acb6b2f3e8",
"timestamp": "2024-07-16T05:44:19Z",
"message_type": "button",
"button": {
"text": "Sent",
"payload": "{\"fullName\":\"Kok Yew Meng\",\"educationlevel\":\"Undergraduate\",\"whentostart\":\"Within 3 months\",\"flow_token\":\"1bd0525c-3bbe-4936-b1f2-26dca373b404\"}",
"sub_type": "flow"
},
"context_status": "available",
"context": {
"message_from": "XXXX",
"message_uuid": "cccc4ae9-516b-470d-a503-dd5482394050"
},
"profile": {
"name": "Kok Yew Meng"
}
}
A documentação da Vonage sobre webhooks de mensagens recebidas está disponível em a Referência da API, em WhatsApp > Botão (Fluxos).