Criando chat bots no Facebook com o IBM Watson — Parte 2 (a integração)

Edit: coloquei uma versão atualizada do código no github: https://github.com/renatodossantosleal/toolchain-facebot

No primeiro post desse tutorial nós tivemos uma introdução de como é possível construir um chat bot utilizando os serviços do Watson e desse modo adicionar inteligência ao mesmo. Nesta etapa vamos nos voltar para o código e juntar o conteúdo criado com a plataforma do Facebook.

Essa é sim uma parte mais técnica mas se você não souber programar até o momento tudo bem! É mais importante ser curioso e gostar de tecnologia.

O que vamos fazer

Basicamente temos duas etapas aqui: a primeira é criar uma página no Facebook para o seu bot (se você já possui uma página da sua empresa basta criar a parte do App dela) e a segunda parte é efetivamente a integração com o seu bot. A arquitetura da solução será mais ou menos assim:

Criando a sua página no Facebook

1. Na sua página inicial do Facebook você deve clicar no menu (seta para baixo) da barra superior e então selecionar criar uma página (Create a Page)
2. Selecione uma categoria para a sua página e o nome da mesma. (Aqui utilizarei “Cause or Community”). Pode pular os outros passos.

Beleza, agora você possui uma página no Facebook para o seu bot, o que precisamos fazer então é criar um app para essa página. Para iniciar acesse o portal de desenvolvedores do Facebook. Na barra superior você verá “Meus Apps” e então a opção de criar um novo App (selecione o basic setup e depois preencha as informações necessárias para criar seu App).

Criando o seu Orquestrador

Para criar o seu orquestrador você precisará criar uma aplicação Node.Js. Basta seguir os seguintes:

1. No seu dashboard clique em criar um App (Create App)
2. Selecione Web e então ‘SDK for Node.JS’
3. Clique em continuar e insira um nome para o seu orquestrador
4. Clique em ‘Download Starter Code’
5. Abra o arquivo app.js e altere o código para o que está nesse gist no GitHub.
6. Edite o arquivo package.json e adicione as seguintes linhas na parte dependencies:

“body-parser”: “1.15.0”,
“request”: “2.72.0”,
“htmlparser”: “1.7.7”,
“watson-developer-cloud”: “2.0.1”

7. Para enviar o código alterado para o Bluemix você deve abrir o console (windows + R e depois cmd), navegar até a pasta onde estão os arquivos e use o seguinte comando CF CLI (se você ainda não instalou ele pode fazer a partir daqui) que pega a informação contida no arquivo manifest.yml:

cf push

Configurando o seu App do facebook

1. Na página de desenvolvimento do seu App no Facebook clique em ‘Webhooks’, depois New Subscription e por último Page.
2. Na parte da URL utilize o endereço do seu broker no bluemix. Aqui tem dois pontos que você deve ter atenção: o primeiro é usar https e o segundo é colocar o /webhook no final do endereço.
3. No token de verificação utilize o token utilizado no seu código (no meu foi tokenDeVerificacaoFacebook que está na linha #21).
4. Na parte de Subscription Fields você deve selecionar: messages, message_deliveries, messaging_options e messaging_postbacks.

O que está acontecendo aqui é a definição de um Webhook que nada mais é do que uma maneira de receber informação entre dois sistemas de forma passiva e em tempo real. Ou seja, é o webhook que faz a conexão e envia as mensagens quando alguém interage com o seu bot. As outras opções selecionadas (Subscription Fields) são basicamente as funcionalidades de chat que iremos utilizar.

Estamos quase lá! Agora você precisa de um token do facebook e para obter o seu basta clicar em add product na barra lateral esquerda e selecionar messenger. Lá você verá a opção de token generation siga o fluxo natural e dê as permissões necessárias, ele te retornará o token do seu aplicativo.

Nesta mesma página selecione a página que você criou para o seu app no campo “Select a page to subscribe your webhook to the page events”.

Rode o seguinte comando curl para associar o app a sua página no Facebook:

curl -X POST "https://graph.facebook.com/v2.6/me/subscribed_apps?access_token=SEU_TOKEN"

Configurando as credenciais do seu orquestrador

Neste último passo você apenas precisa inserir as credenciais do seu bot criado no serviço do Conversation e o token gerado pelo Facebook no seu orquestrador. Para isso:

Abra o arquivo app.js e altere:

1. A linha #13 com o seu usuário do serviço do Conversation
2. A linha #14 com a senha do serviço do Conversation
3. A linha #18 com o workspace que você utilizará
4. A linha #105 com o token gerado pelo Facebook.

Depois dessas alterações basta reenviar o seu app com as alterações para o Bluemix utilizando novamente o comando (na pasta correta):

cf push

Finalizando e considerações finais

Pronto agora o seu bot já está funcionando e respondendo. Você pode dar permissão para que seus amigos testem alterando as configurações na aba roles do seu app no facebook.

PS: O fluxo de informações normalmente se dá com o Facebook fazendo uma chamada na API do Watson então eu resolvi tirar o conversation_start do meu diálogo e esperar o usuário iniciar a conversa. Se você quiser que a mensagem apareça logo no início eu sugiro utilizar a versão do messenger do conversation start como eles falam nas boas práticas.

PS2: Não se esqueça que o messenger limita as respostas a 320 caracteres!

É isso! Qualquer dúvida ou sugestão de melhoria é só falar.