Facebook Messenger

Commencez par générer la clé secrète d'application et le jeton d'accès à la page dans Facebook Messenger.

1. Connectez-vous au compte de développeur Facebook.
2. Créez l'application Facebook que vous utiliserez pour le canal :
   1. Dans votre navigateur, accédez à https://developers.facebook.com/apps/.
   2. Sélectionnez l'onglet Mes applications et cliquez sur Créer une application.
   3. Sur la page Détails de l'application de l'assistant Créer une application, entrez le nom que vous souhaitez utiliser pour l'application et l'adresse électronique que vous souhaitez utiliser comme contact pour l'application. Cliquez ensuite sur Suivant.
   4. Sur la page Cas d'emploi, sous Filtrer par, sélectionnez Messagerie métier. Sélectionnez ensuite Interagir avec les clients sur Messenger à partir de Meta, puis cliquez sur Suivant.
   5. Cliquez sur les autres pages de l'assistant, puis sur la page Présentation, cliquez sur Créer une application.
3. Une fois l'application créée, sélectionnez-la (à gauche de la page Mes applications), puis, dans la section Paramètres d'application, sélectionnez De base.
4. Copiez la valeur du champ Clé secrète d'application et collez-la à un endroit pratique sur votre système.

   Vous aurez besoin de la clé secrète d'application pour terminer votre configuration du canal Facebook.

5. Dans la section Page Application, cliquez sur Créer une page.
6. Sur la page Créer une page, renseignez les champs requis, puis cliquez sur Créer une page.
   Remarque
   
   Le nom de page doit contenir le nom de l'application.
7. Générez un jeton d'accès :
   1. Sélectionnez Outils > Explorateur d'API de graphique.
   2. Dans la section Jeton d'accès de la page, pour Application bêta, sélectionnez le nom de votre application.
   3. Pour le champ Utilisateur ou Page, sélectionnez Obtenir un jeton.
   4. Dans la section Droits d'accès, cliquez sur Ajouter une autorisation et sélectionnez les droits d'accès suivants :
      • business_management
      • pages_manage_metadata
      • pages_messaging
      • pages_show_list
   5. Cliquez sur Générer un jeton d'accès.
8. Copiez le jeton d'accès et collez-le dans un emplacement approprié.

   Vous utiliserez ce jeton, qui autorise l'application Facebook à accéder à l'API de messagerie de Facebook, pour terminer la définition de votre canal dans Digital Assistant.

Dans Facebook Messenger, définissez l'URL de callback à l'aide de l'URL de webhook générée par Digital Assistant à l'étape précédente.

1. Dans la console Facebook Messenger, accédez au projet que vous avez initialement créé pour le webhook.
2. Sélectionnez Paramètres de l'API Messenger pour ouvrir la page Configuration de l'API Messenger.
3. Dans le champ URL de callback, collez l'URL de webhook obtenue à partir de la page Canaux de l'assistant numérique.
4. Dans le champ Vérifier le jeton de la console Messenger, collez le jeton de vérification à partir de la page Canaux de l'assistant numérique.
5. Dans la section Champs de webhook, sélectionnez les événements de callback messages et messaging_postbacks.
6. Cliquez sur Vérifier et enregistrer.
7. Abonnez-vous à la page :
   1. Dans la section Générer des jetons d'accès de la page Configuration de l'API Messenger, sélectionnez la page Facebook de votre canal.
   2. Cliquez sur Ajouter un abonnement.
   3. Dans la boîte de dialogue Modifier les abonnements de page, vérifiez que les options messages et messaging_postbacks sont sélectionnées et cliquez sur Confirmer.

Une fois la configuration terminée, vous êtes prêt à activer le canal Facebook.

• Dans Digital Assistant, sélectionnez le canal et activez l'option Canal activé.
• Cliquez sur et sélectionnez l'assistant numérique ou la brique à associer au canal.

Vous pouvez maintenant tester le bot via le canal.

Après avoir configuré le canal Facebook et la messagerie, vous pouvez tester votre bot à l'aide de votre page Facebook, de Facebook Messenger (https://www.messenger.com/) et de l'application Facebook Messenger sur votre appareil.

1. Accédez à https://www.messenger.com/.
2. Dans l'interface Messenger, saisissez le nom de la page à rechercher.
3. Commencez à discuter avec votre assistant numérique (ou votre brique autonome).

Facebook Messenger vous permet de créer un menu fixe à côté de son champ Message. Reportez-vous à https://developers.facebook.com/docs/messenger-platform/send-messages/persistent-menu/ pour plus d'informations sur cette fonctionnalité.

L'exemple ci-dessous illustre les éléments de menu fixe "Order Pizza" et "Order Pasta" :

Description de l'illustration persist-menu1.jpg

Les canaux Facebook Messenger de Digital Assistant prennent en charge les fonctionnalités suivantes :

• texte (envoi et réception),
• images (envoi et réception),
• fichiers (envoi et réception),
• emojis (envoi et réception),
• localisation, mais en phase d'abandon (envoi et réception),
• liens,
• postbacks,
• demandes de localisation,
• propriétés personnalisées,
• composants de carrousel,
• composants de liste.

Si vous ciblez votre brique sur plusieurs canaux avec des fonctionnalités et une syntaxe de formatage différentes, vous pouvez utiliser le balisage HTML de base dans vos messages. Si vous le faites, ce balisage sera automatiquement converti au format de balisage de Facebook Messenger lorsque le message sera transmis au canal. Cela est particulièrement utile si vous ciblez vos compétences sur d'autres canaux en plus de Facebook Messenger. Reportez-vous à Formatage de texte enrichi dans les canaux.

Les canaux Facebook Messenger de Digital Assistant présentent les contraintes de message suivantes :

• Messages texte
  • Longueur maximale du message texte : 640 caractères. Si la longueur est supérieure à 640, le texte est divisé en plusieurs messages.
  • Longueur maximale du libellé d'action de texte : 20 caractères
  • Types d'action de texte autorisés : postback, appel, URL
  • Nombre maximal d'actions de texte : 3. S'il existe davantage d'actions de texte, le message est converti en plusieurs cartes horizontales, le même texte étant utilisé en tant que titre sur chacune d'elles. Chaque carte contient jusqu'à 3 actions.
• Cartes horizontales
  • Longueur maximale du titre : 80 caractères
  • Longueur maximale de la description : 80 caractères
  • Longueur maximale du libellé d'action de carte : 20 caractères
  • Nombre maximal de cartes : 10
  • Nombre maximal d'actions de carte : 3. Si le nombre d'actions de carte dépasse 3, la carte est dupliquée pour afficher les actions de carte restantes.
  • Nombre minimal d'actions de carte : 0
  • Nombre maximal d'actions de liste de cartes : 0
  • Au moins une description, une image ou une action requise ? : oui
  • Types d'action de carte autorisés : postback, appel, URL, partage.
  • Types d'action de liste de cartes autorisés : N/A
• Cartes verticales
  • Non pris en charge
• Messages de pièce jointe
  • Pris en charge ? : oui
  • Actions de pièce jointe autorisées ? : non
• Boutons d'action
  • Longueur maximale du libellé d'action globale : 20 caractères
  • Nombre maximal d'actions globales : 11
  • Types d'action globale autorisés : postback

Pour les canaux Facebook Messenger, vous pouvez étendre les fonctionnalités des composants de réponse commune avec des fonctions propres à Facebook.

Pour accéder aux extensions, utilisez l'élément channelCustomProperties des métadonnées du composant Common Response et définissez les propriétés appropriées. Le format du code est le suivant :

...
            channelCustomProperties:
            - channel: "facebook"
              properties:
                PROPERTY_NAME: "PROPERTY_VALUE"
...

Les propriétés personnalisées disponibles pour les canaux Facebook Messenger sont les suivantes :

Voici un exemple des propriétés personnalisées définies au niveau de l'élément de réponse (top_element_style) et au niveau des cartes (webview_height_ratio et fallback_url) :

responseItems:
  - type: "cards"
    cardLayout: "vertical"
    cards:
      - title: "${pizzas.name}"
        description: "${pizzas.description}"
        imageUrl: "${pizzas.image}"
        url: "${pizzas.moreInfo}"
        iteratorVariable: "pizzas"
        channelCustomProperties:
          - channel: "facebook"
            properties:
              webview_height_ratio: "compact"
              fallback_url: "http://www.oracle.com"
    channelCustomProperties:
      - channel: "facebook"
        properties:
          top_element_style: "large"
...

Pour obtenir des informations plus générales sur channelCustomProperties, reportez-vous à Extensions propres à un canal.