Français
  1. Aide Zendesk
  2. Chat
  3. Utilisation de Chat
  4. Configuration et utilisation de Message

Configuration du transfert à partir du chatbot en utilisant le protocole de transfert de Facebook Messenger

Lisa Kelly
  • Modifié

Cet article décrit comment configurer le transfert à partir du chatbot en utilisant le protocole de transfert à partir du chatbot de Facebook Messenger. Avec cette méthode, l’état de la conversation est géré par Facebook. Pour en savoir plus la configuration du transfert à partir du chatbot en utilisant le protocole de Zendesk Message, consultez Configuration du transfert à partir du chatbot en utilisant le protocole de transfert de Zendesk Message.

Pour configurer le transfert à partir du chatbot, suivez les étapes suivantes :

Lien vers votre page

Pour commencer, ajoutez Facebook Messenger comme canal pour capturer les conversations de votre page Facebook dans Zendesk Message. Pour en savoir plus, consultez Ajout et gestion des canaux et Configuration du canal Facebook.

Une fois que vous avez ajouté Facebook Messenger comme canal pour capturer les conversations sur votre page Facebook, vous pouvez utiliser des assistants pour transférer ces conversations sous forme de messages lorsque vous êtes hors ligne.

Création de votre serveur de chatbot écho

Ensuite, créez votre serveur de chatbot écho :

Remarque – Vous pouvez ignorer cette section si vous savez déjà comment créer un chatbot Facebook Messenger.
  1. Suivez le Didacticiel de mise en route fourni par Facebook pour créer votre premier chatbot dans nodejs.

    Vous n’avez besoin que d’aller jusqu’à l’étape 5 du didacticiel « Créer le chatbot » pour procéder à la configuration du transfert à partir du chatbot. Plus loin dans cet article, vous allez créer les fonctions de transfert à partir de ce chatbot écho.

  2. Lorsque vous créerez le chatbot, notez le token d’accès de la page Applications Facebook. Vous aurez besoin de ces informations plus tard pour configurer le transfert à partir du chatbot.

À ce stade, vous devriez avoir un serveur de chatbot fonctionnel, une page Facebook et une application Facebook représentant votre serveur de chatbot abonné à votre page Facebook.

Configuration des rôles des applications

Pour configurer les rôles des applications sur votre page Facebook :

  1. Ouvrez votre page Facebook dans une fenêtre de navigateur et naviguez jusqu’à Paramètres > Messenger.
  2. Faites défiler jusqu’à la section Abonnements aux Apps.
  3. Définissez votre chatbot Facebook en tant que Récepteur principal.
  4. Définissez l’application Zendesk Message en tant que Récepteur secondaire.

    Le récepteur principal peut recevoir des événements de messagerie, les récepteurs secondaires ne reçoivent que les événements en attente.

À ce stade, vous devriez pouvoir voir un message de réussite sur la page Facebook > Intégrations du tableau de bord de Zendesk Message. Vous devriez aussi pouvoir recevoir les messages dans votre chatbot.

Même si le tableau de bord de Zendesk Message affiche un message de réussite, la configuration n’est pas terminée. Vous devez configurer votre serveur de chatbot pour pouvoir envoyer des demandes de flux de transfert.

Envoi de la demande de flux de transfert lors d’un message utilisateur

Avant de commencer cette section, vérifiez les points suivants :

Pour changer votre code de serveur de chatbot afin qu’il envoie et traite les demandes de flux :

Maintenant que Zendesk Message est défini comme récepteur secondaire et que votre chatbot est le récepteur primaire, les messages seront traités par défaut par votre chatbot et aucun message utilisateur n’apparaîtra dans le tableau de bord de Zendesk Message. Pour qu’un message d’un visiteur de la page apparaisse dans Zendesk Message, vous devez envoyer la demande pass_thread_control au serveur Facebook pour transférer la conversation vers l’application Zendesk Message.

À des fins de test, vous pouvez le faire manuellement via la ligne de commande (en utilisant curl ou un autre programme pour déclencher la demande). Cependant, la meilleure approche consiste à laisser les utilisateurs décider quand discuter avec un agent plutôt qu’avec un chatbot. Par exemple, vous pouvez permettre aux utilisateurs de passer du chat avec un chatbot à un chat avec un agent en tapant une phrase spécifique (par exemple : « chatter avec un agent »).
  1. Changez le gestionnaire de messages pour qu’il appelle sendPassThread lorsque le message de l’utilisateur est identique à la phrase clé que vous avez définie pour le transfert à partir du chatbot. Sinon, envoyez un message écho. Servez-vous de l’exemple de code suivant comme modèle.
    Remarque – Pour voir cet exemple avec la syntaxe mise en évidence, voir Annexe : exemples de code à la fin de cet article.
    ...
app.post('/webhook', (req, res) => {
    const body = req.body;
 
    if (body.object === "page") {
        body.entry.forEach(entry => {
            if (entry.messaging) {
                const event = entry.messaging && entry.messaging[0];
                if (event.message) {
                    handleMessage(event.sender.id, event.message);
                }
            }
        });
        res.status(200).send('EVENT_RECEIVED');
    } else {
        res.sendStatus(404);
    }
});
...
 
function handleMessage(senderId, message) {
    let response;
 
    if (message.text) {
        if (message.text.trim() === "chat with agent") {
            sendPassThread(senderId);
        } else {
            sendEcho(senderId, `[bot] ${message.text}`);
        }
    }
}
 
function sendEcho(message) {
    request(
        {
            uri: "https://graph.facebook.com/v2.6/me/messages",
            qs: { access_token: ACCESS_TOKEN },
            method: "POST",
            json: {
                recipient: {
                    id: senderId
                },
                message: { text }
            }
        },
        (err, res, body) => {
            if (err || body.error) {
                log("UNABLE TO SEND", err || body.error);
            } else {
                log("RESPONSE SENT");
            }
        }
    );
}
  2. Implémentez le sendPassThread. Servez-vous de l’exemple de code suivant comme modèle. Pour plus d’informations, voir Pass Thread Control API Reference dans Facebook.
    Remarque – Pour voir cet exemple avec la syntaxe mise en évidence, voir Annexe : exemples de code à la fin de cet article.
    function sendPassThread(senderId) {
    request(
        {
            uri: "https://graph.facebook.com/v2.6/me/pass_thread_control",
            qs: { access_token: ACCESS_TOKEN }, // access token of your app (bot server) to your page
            method: "POST",
            json: {
                recipient: {
                    id: senderId
                },
                target_app_id: MESSAGE_APP_ID // you can retrieve this in your page setting after linking zendesk message - 200646160103180
            }
        },
        (err, res, body) => {
            if (err || body.error) {
                console.log("UNABLE TO SEND PASS THREAD REQUEST", err || body.error);
            } else {
                console.log("PASSED THREAD TO MESSAGE DASHBOARD BOT");
            }
        }
    );
}
  3. Lorsqu’un agent marque une conversation comme terminée, Facebook envoie un webhook passThread à votre serveur de chatbot. Pour écouter le pass_thread_event, utilisez cet exemple de code comme modèle :
    Remarque – Pour voir cet exemple avec la syntaxe mise en évidence, voir Annexe : exemples de code à la fin de cet article.
    
...
app.post('/', (req, res) => {
    const body = req.body;
 
    if (body.object === "page") {
        body.entry.forEach(entry => {
            if (entry.messaging) {
                const event = entry.messaging && entry.messaging[0];
                ...
                if (event.pass_thread_control) {
                    handlePassThread(event.sender.id, event.pass_thread_control);
                }
                ...
            }
        });
        res.status(200).send('EVENT_RECEIVED');
    } else {
        res.sendStatus(404);
    }
});
...
 
function handlePassThread(senderId, passThreadMessage) {
    console.log("PASS THREAD EVENT:", passThreadMessage);
}
    Pour en savoir plus, consultez ces documents sur l’API de Facebook :
    Vous pouvez également utiliser des postbacks pour envoyer le passthread lorsque l’utilisateur clique sur un bouton de message ou sélectionne une commande de menu. Pour en savoir plus, consultez ces documents sur Facebook :

Vérification du transfert à partir du chatbot

Pour confirmer que le transfert à partir du chatbot fonctionne correctement, vérifiez les trois scénarios suivants :
  1. Lorsqu’un utilisateur lance une conversation, vous voyez votre écho de chatbot et aucun message n’apparaît dans le tableau de bord de Zendesk Message.
  2. Lorsqu’un utilisateur envoie une phrase chatter avec un agent (ou toute autre phrase que vous avez définie), puis envoie ensuite un message, vous voyez ce dernier dans le tableau de bord de Zendesk Message.
  3. Lorsqu’un agent marque la conversation comme terminée, vous recevez un événement passThread dans la console de votre serveur de chatbot. Par exemple :
    PASS THREAD EVENT: {new_owner_app_id: 128624987631714, metadata: null }

    À partir de là, si l’utilisateur envoie un autre message, la transaction devrait être identique à celle du premier scénario, dans laquelle l’utilisateur lance la conversation et interagit avec le chatbot.

Si les trois cas fonctionnent comme prévu, cela signifie que vous avez correctement déployé le transfert à partir du chatbot géré par Facebook avec Zendesk Message.

Annexe : exemples de code

Cette section contient les exemples de code mentionnés ci-dessus, avec la syntaxe mise en évidence. 

Exemple de code pour appeler le sendPassThread

...
app.post('/webhook', (req, res) => {
    const body = req.body;
 
    if (body.object === "page") {
        body.entry.forEach(entry => {
            if (entry.messaging) {
                const event = entry.messaging && entry.messaging[0];
                if (event.message) {
                    handleMessage(event.sender.id, event.message);
                }
            }
        });
        res.status(200).send('EVENT_RECEIVED');
    } else {
        res.sendStatus(404);
    }
});
...
 
function handleMessage(senderId, message) {
    let response;
 
    if (message.text) {
        if (message.text.trim() === "chat with agent") {
            sendPassThread(senderId);
        } else {
            sendEcho(senderId, `[bot] ${message.text}`);
        }
    }
}
 
function sendEcho(message) {
    request(
        {
            uri: "https://graph.facebook.com/v2.6/me/messages",
            qs: { access_token: ACCESS_TOKEN },
            method: "POST",
            json: {
                recipient: {
                    id: senderId
                },
                message: { text }
            }
        },
        (err, res, body) => {
            if (err || body.error) {
                log("UNABLE TO SEND", err || body.error);
            } else {
                log("RESPONSE SENT");
            }
        }
    );
}

Exemple de code pour implémenter le sendPassThread

function sendPassThread(senderId) {
    request(
        {
            uri: "https://graph.facebook.com/v2.6/me/pass_thread_control",
            qs: { access_token: ACCESS_TOKEN }, // token d’accès de votre application (serveur de chatbot) vers votre page
            method: "POST",
            json: {
                recipient: {
                    id: senderId
                },
                target_app_id: MESSAGE_APP_ID // vous pouvez récupérer ceci dans votre paramètre de page après avoir associé Zendesk Message - 200646160103180
            }
        },
        (err, res, body) => {
            if (err || body.error) {
                console.log("UNABLE TO SEND PASS THREAD REQUEST", err || body.error);
            } else {
                console.log("PASSED THREAD TO MESSAGE DASHBOARD BOT");
            }
        }
    );
}

Exemple de code pour écouter pass_thread_event

...
app.post('/', (req, res) => {
    const body = req.body;
 
    if (body.object === "page") {
        body.entry.forEach(entry => {
            if (entry.messaging) {
                const event = entry.messaging && entry.messaging[0];
                ...
                if (event.pass_thread_control) {
                    handlePassThread(event.sender.id, event.pass_thread_control);
                }
                ...
            }
        });
        res.status(200).send('EVENT_RECEIVED');
    } else {
        res.sendStatus(404);
    }
});
...
 
function handlePassThread(senderId, passThreadMessage) {
    console.log("PASS THREAD EVENT:", passThreadMessage);
}
Vous avez d’autres questions ? Envoyer une demande

0 Commentaires

Vous devez vous connecter pour laisser un commentaire.

Articles connexes

Articles associés

Réalisé par Zendesk