Gerenciamento de endereços de WhatsApp do Conversations
Este produto Twilio está atualmente disponível como uma versão Beta. Alguns recursos ainda não foram implementados e outros podem ser alterados antes que o produto seja declarado como disponível para o público em geral. O uso desta versão Beta está sujeito aos termos relevantes do contrato de licença vigente. Os produtos Beta não são abrangidos por um SLA da Twilio. Saiba mais sobre o suporte a produtos Beta.
Flex Conversations requer Flex UI (IU do Flex) 2.0. Se você estiver no Flex UI (IU do Flex) 1.x, consulte as páginas Chat e mensagens.
Connect your WhatsApp sender number to Flex Conversations by following one of the two approaches outlined below. For numbers already registered with WhatsApp, use the Create a WhatsApp address via Flex Console instructions. For numbers using the WhatsApp sandbox, use the Configuring Whatsapp Sandbox instructions.
Como criar um endereço de WhatsApp via console do Flex
Para criar um endereço do Conversations para o WhatsApp, você precisa ter um remetente do WhatsApp registrado em sua conta da Twilio. Infelizmente, esse não é um processo rápido e inclui registro e verificação no lado do WhatsApp. Para testar usando o sandbox do WhatsApp , consulte a próxima etapa. Para começar, navegue atéMessaging (Mensagens) > Senders (Remetentes) > WhatsApp senders (Remetentes do WhatsApp) no console da Twilio. O restante presume que você já tenha um número de WhatsApp registrado em sua conta.
Você pode criar endereços de WhatsApp via Console do Flex > Manage (Gerenciar) > Messaging (Mensagens):
- Clique em + Add new Address (+ Adicionar novo endereço) na guia Conversations Addresses (Endereços do Conversations).
- Selecione WhatsApp como o tipo de endereço.
- Opcionalmente, você pode inserir um nome amigável.
- Escolha seu número de WhatsApp (remetente) no menu suspenso.
- Configure the integration to Flex – either by using Studio or Webhook. Unless you have removed or reconfigured it, you should be good to use the out-of-box Studio Flow “Messaging Flow”. To learn more about configuring Studio Flows, see Configure pre-agent workflow with Studio.
- Clique em Submit (Enviar) para salvar seu novo endereço de WhatsApp do Flex.
Você pode editar ou excluir endereços do WhatsApp a qualquer momento usando o console do Flex.
Configuração do sandbox do WhatsApp
Estas instruções são para configurar o sandbox do WhatsApp para trabalhar com o Flex Conversations. Se você tiver um número de WhatsApp registrado, consulte as instruções acima em vez desta seção. Os números de WhatsApp registrados são configurados de forma semelhante ao SMS.
- Como não temos suporte de criação automática para o sandbox do WhatsApp, precisaremos interceptar as mensagens recebidas para criar conversas. Crie outra função com o seguinte código. Isso usa o mesmo fluxo do Studio que as instruções para SMS e foi testado no tempo de execução do nó v12 e v14:
- Declare twilio como uma dependência. Isso importa automaticamente os módulos npm relacionados para sua função.
- Defina STUDIO_FLOW_SID como uma variável de ambiente usando o ID exclusivo (prefixado pelo FW) do newly created Studio Flow (fluxo do Studio recém‐criado).
- Observe que essa função não lida com a criação de uma conversa corretamente quando a primeira mensagem do WhatsApp é um anexo. Isso pode resultar em avisos/erros registrados pelo fluxo do Studio. Isso não é um problema para endereços do WhatsApp que não são sandbox.
- whatsapp.protected.js
/* Handles WhatsApp messages by * 1. Creating a conversation * 2. Adding the participant that sent that message * 3. Adding the message to the conversation * If any of these fail, the conversation is deleted */ exports.handler = async function(context, event, callback) { const isConfigured = context.STUDIO_FLOW_SID; const response = new Twilio.Response(); response.appendHeader('Access-Control-Allow-Origin', '*'); response.appendHeader('Access-Control-Allow-Methods', 'GET,POST,OPTIONS'); response.appendHeader('Content-Type', 'application/json'); response.appendHeader('Access-Control-Allow-Headers', 'Content-Type'); console.log(`Received Event: ${JSON.stringify(event)}`); if ( !isConfigured) { response.setBody({ status: 500, message: "Studio Flow SID is not configured" }); callback(null, response); return; } const client = context.getTwilioClient(); let conversation; const webhookConfiguration = { 'target': 'studio', 'configuration.flowSid': context.STUDIO_FLOW_SID, 'configuration.replayAfter': 0, 'configuration.filters': ['onMessageAdded'] }; try { conversation = await client.conversations.conversations.create({'xTwilioWebhookEnabled':true,}); console.log(`Created Conversation with sid ${conversation.sid}`); try { console.log(`Adding studio webhook to conversation ${conversation.sid}`); await client.conversations.conversations(conversation.sid) .webhooks .create(webhookConfiguration); } catch(error) { console.log(`Got error when configuring webhook ${error}`); response.setStatusCode(500); return callback(error, response); } } catch( error) { console.log(`Couldnt create conversation ${error}`) return callback(error) } try { const participant = await client.conversations.conversations(conversation.sid) .participants .create({ 'messagingBinding.address': `${event.From}`, 'messagingBinding.proxyAddress': `${event.To}` }); console.log(`Added Participant successfully to conversation`) } catch(error) { console.log(`Failed to add Participant to conversation, ${error}`) console.log(`In case the error is something about "A binding for this participant and proxy address already exists", check if you havent used the Sandbox in any other instance you have. As Whatsapp Sandbox uses the same number across all accounts, could be that the binding of [Your Phone] + [Sandbox WA number] is already created in the other instance.`) try { await client.conversations.conversations(conversation.sid).remove(); console.log("Deleted conversation successfully") } catch (error) { console.log(`Failed to remove conversation, ${error}`) } return callback(null,""); } // Now add the message to the conversation try { const body = event.Body !== '' ? event.Body : 'Empty body, maybe an attachment. Sorry this function doesnt support adding media to the conversation. This should work post private beta'; console.log(`Setting body to ${body}`) const message = await client.conversations.conversations(conversation.sid) .messages .create({ 'author': `${event.From}`, 'body': `${body}`, 'xTwilioWebhookEnabled':true, }); console.log(`Added message successfully to conversation`) } catch(error) { console.log(`Failed to add message to conversation, ${error}`) try { await client.conversations.conversations(conversation.sid).remove(); } catch (error) { console.log(`Failed to remove conversation, ${error}`) } return callback(null, `${error}`); } return callback(null, ""); };
- Defina sua função como protegida e implante sua função e copie o URL da função. Se estiver usando o console da Twilio para adicionar sua função, será possível clicar nos três pontos ao lado do nome da função e selecionar "Copy URL (Copiar)".
- Acesse as WhatsApp Sandbox Settings (Configurações do sandbox do WhatsApp) e registre o número que você está usando para teste. Na seção Sandbox Configuration (Configuração do sandbox), cole o URL da função no campo "WHEN A MESSAGE COMES IN (QUANDO UMA MENSAGEM CHEGAR)"
- Se você não registrou seu número WhatsApp no sandbox, faça isso agora seguindo as instruções na seção de participantes do WhatsApp. Por exemplo, no caso abaixo, você enviaria "join cloud-forgot" para o número +1 415 523 8886 do WhatsApp.
- Observe que esse registro é válido por três dias e você terá que se registrar novamente após esse período.
- Salve as configurações.
- Agora você pode testar a integração do WhatsApp enviando uma mensagem do WhatsApp para o número de telefone do sandbox.
- Se tudo tiver sido configurado corretamente, isso deverá ser processado como uma tarefa recebida do WhatsApp em seu aplicativo Flex. Siga as etapas 1 e 2 de "Send your first SMS (Como enviar seu primeiro SMS)" para aceitar a tarefa recebida e testar o WhatsApp no Flex.
Precisa de ajuda?
Às vezes, todos nós precisamos; a programação é difícil. Receba ajuda agora da nossa equipe de suporte, ou confie na sabedoria da multidão navegando pelo Stack Overflow Collective da Twilio ou buscando a tag Twilio no Stack Overflow.