Canais de mensagens no Facebook

Tanto mensagens simples quanto mensagens ricas podem ser enviadas via Facebook Messenger

Configuração

As mensagens do Facebook são construídas usando um modelo de webhook. A configuração tanto para mensagens simples quanto para mensagens ricas é a mesma, veja o guia rápido de início do Webhooks para a configuração inicial.

Para o Facebook, a URL a ser usada (retirada da documentação da API do Facebook Messenger) é https://graph.facebook.com/v2.6/me/messages?access_token=************************.

O tipo de corpo do Pedido é sempre Texto Bruto, com os parâmetros fornecidos em formato JSON, detalhados nas seções seguintes para mensagens simples e ricas.

Por fim, essa API requer um cabeçalho. Clique em Adicionar cabeçalho e defina a chave para Type-Conteúdo e o valor para application/json.

Canal de mensagens simples

No exemplo abaixo, você pode ver como um canal simples do Facebook Messenger é construído usando um modelo de webhook.

Os parâmetros do corpo da solicitação para este endpoint Messages são:

• recipient: Nome do Objeto JSON contendo parâmetros para o usuário para o qual a mensagem deve ser enviada

  • id: o ID do Facebook Messenger do usuário. Isso é extraído do perfil do seu usuário via a sintaxe de personalização {{fb_messenger_id}}

• message: Nome do Objeto JSON contendo parâmetros para o conteúdo da mensagem

  • text: O texto da mensagem a ser enviada

{
  "recipient": {
    "id":"{{fb_messenger_id}}"
  },
  "message": {
    "text": "Your Message here"
  }
}

O estilo simples da mensagem aparece como uma notificação na tela de bloqueio do celular e aparece no aplicativo Messenger no celular ou na web, conforme mostrado abaixo:

Canal de mensagens ricas

Esse estilo de mensagem rico terá elementos que aparecem como no exemplo abaixo no Facebook Messenger. Ele usa um modelo chamado Facebook Messenger de modelo genérico:

Existem vários tipos adicionais de mensagens enriquecidos que você pode criar, que estão detalhados nos documentos do Facebook Messenger e incluem:

• Modelo de Lista

• Modelo de Mídia

• Modelo de Recibos

• Modelos de Companhias Aéreas

O modelo de lista é ótimo para atualizações de notícias para editoras, o modelo de mídia permite enviar vídeos e outros conteúdos ricos, o modelo de recibo é ótimo para enviar recibos de comércio eletrônico e os modelos de companhias aéreas cobrem casos de uso como cartões de embarque, etc.

Os parâmetros do corpo da solicitação para o endpoint desta mensagem incluem:

• recipient: Nome do Objeto JSON contendo parâmetros para o usuário para o qual a mensagem deve ser enviada

  • id: o ID do Facebook Messenger do usuário. Isso é extraído do perfil do seu usuário via a sintaxe de personalização {{fb_messenger_id}}

• message: Nome do Objeto JSON contendo parâmetros para o conteúdo da mensagem

  • attachment: Objeto JSON para mensagem com conteúdo rico anexado

    • type: tipo de anexo "template" para este exemplo

    • payload: Objeto JSON para a carga útil da mensagem

      • template_type: o tipo de modelo usado é "genérico" para este exemplo. Para saber mais sobre o modelo genérico do Facebook Messenger, veja a documentação

      • elements: Array JSON com objetos para elementos individuais da mensagem

        • image_url: a URL da imagem

        • title: título da mensagem aparece abaixo da imagem

        • subtitle: o subtítulo que aparece abaixo do título

        • buttons: os botões CTA que aparecem abaixo da legenda

{
  "recipient": {
    "id": "{{fb_messenger_id}}"
  },
  "message": {
    "attachment": {
      "type": "template",
      "payload": {
        "template_type":"generic",
        "elements": [
          {
            "title": "YOUR TITLE HERE",
            "image_url": "YOUR IMAGE URL HERE",
            "subtitle": "YOUR SUBTITLE HERE",
            "buttons": [
              {
                "type": "web_url",
                "url": "YOUR LINK HERE",
                "title": "BUTTON TEXT HERE"
              }
            ]
          },
          ...... ADDITIONAL ELEMENTS
        ]
      }
    }
  }
}

Você pode usar uma mensagem de exemplo abaixo baseada no conteúdo do blog do xtremepush para testar rapidamente esse estilo de mensagem.

{
  recipient: {
    id: recipientId
  },  
  "message": {
    "attachment": {
      "type": "template",
      "payload": {
        "template_type": "generic",
        "elements": [
          {
            "title": "Geofencing vs iBeacons",
            "image_url": "https://d2duw1tbgzwwah.cloudfront.net/wp-content/uploads/2017/10/geo-vs-beacons-750x500.jpg?resize=720%2C346&ssl=1",
            "subtitle": "Which best suits your Business?",
            "buttons": [
              {
                "type":"web_url",
                "url":"https://xtremepush.com/xtremepush-geofencing-ibeacons/",
                "title":"Read More"
              }
            ]
          },
          {
            "title": "GDPR – The Practicalities of a New Reality",
            "image_url": "https://d2duw1tbgzwwah.cloudfront.net/wp-content/uploads/2017/05/GDPR-Practicalities-NEWS-750x423.png?resize=1250%2C600&ssl=1",
            "subtitle": "There are now about 380 days until GDPR is ‘the new reality",
            "buttons": [
              {
                "type":"web_url",
                "url":"https://xtremepush.com/gdpr-get-gdpr-compliant/",
                "title":"Read More"
              }
            ]
          }
        ]
      }
    }
  }
}

O estilo de mensagem rica aparece no aplicativo de mensagens no celular ou web, conforme mostrado abaixo (mensagem com imagens e CTA abaixo são do exemplo acima).