Comment construire votre premier télégramme Chatbot avec Node.js –

Ce matin, vous vous êtes réveillé avec l’idée de mettre au point un moyen de stocker et d’étiqueter les articles intéressants que vous avez lus. Après avoir joué à cette idée, vous vous rendez compte qu'un chatbot Telegram est la solution la plus pratique pour résoudre ce problème.

Dans ce guide, nous vous expliquerons tout ce que vous devez savoir pour créer votre premier chatbot Telegram à l'aide de JavaScript et Node.js. .

Pour commencer, nous devons enregistrer notre nouveau bot auprès de ce qu'on appelle Botfather afin de recevoir notre jeton d'accès à l'API.

Enregistrement de bot avec @BotFather

Le premier pas vers notre propre bot Telegram est l'enregistrement. le bot avec le BotFather. Le BotFather est un bot lui-même qui vous rend la vie beaucoup plus facile. Il vous aide à enregistrer des robots, à modifier la description du bot, à ajouter des commandes et à vous fournir le jeton d'API pour votre bot.

Le jeton d'API est l'étape la plus importante car il vous permet d'exécuter le code permettant d'effectuer des tâches. pour le bot

1. Trouver le BotFather

On peut trouver le BotFather dans Telegram en cherchant "BotFather". Cliquez sur BotFather officiel, indiqué par l'icône en forme de coche blanche dans le cercle bleu.

2. Enregistrer un nouveau bot

Nous avons maintenant trouvé BotFather, allons lui parler! Vous pouvez démarrer la conversation en tapant / newbot . BotFather vous demandera de choisir un nom pour vos deux. Ce nom peut être n'importe quoi et ne doit pas nécessairement être unique. Pour simplifier les choses, j'ai nommé mon bot ArticleBot .

Vous serez ensuite invité à saisir un nom d'utilisateur pour le bot. Le nom d'utilisateur doit être unique et se terminer par bot . Par conséquent, j'ai choisi michiel_article_bot car ce nom d'utilisateur n'a pas encore été pris. Ce sera également le nom d’utilisateur que vous utiliserez pour rechercher le bot dans le champ de recherche de Telegram.

FatherBot renverra un message de succès avec votre jeton pour accéder à l’API HTTP de Telegram. Assurez-vous de stocker ce jeton en toute sécurité et ne le partagez certainement pas avec qui que ce soit.

3. Modification du bot

Nous pouvons modifier le bot en ajoutant une description ou en définissant les commandes que nous souhaitons que le bot connaisse. Vous pouvez envoyer un message au bot avec le texte / setcommands . Il vous montrera comment entrer les commandes au format commande1 - Description .

Pour mon bot, je règle la commande dans un signet - enregistre l’URL de l’article intéressant .

[1965

Si vous regardez votre bot maintenant, vous verrez une icône de commande dans la boîte de discussion qui vous indique les commandes disponibles. Vous pouvez créer beaucoup plus de commandes qui fonctionnent et ne pas les lister via BotFather. Cependant, d'un point de vue UX, je vous recommande d'enregistrer toutes les commandes disponibles avec BotFather.

Nous pouvons définir la confidentialité du bot avec / setprivacy . Vous pouvez soit l'activer ou le désactiver . Par défaut, la valeur de confidentialité est définie sur activé ce qui signifie que votre bot ne recevra que les messages commençant par le symbole / ou en mentionnant son nom d'utilisateur.

Ce paramètre peut être désactivé, ce qui signifie que votre bot peut recevoir tous les messages envoyés à un groupe. Vous devrez ajouter un bot à votre groupe pour qu'il reçoive tous ces messages.

Vous trouverez une liste de toutes les commandes disponibles ici:

Enfin, nous sont tous prêts à commencer à coder. Assurez-vous que le jeton d'accès à l'API est prêt.

Codage de votre première commande de bot

Tout d'abord, au cours de ce didacticiel, nous utiliserons le code suivant que j'ai préparé .

C'est un simple projet Node.js qui n'a que deux dépendances: dotenv et node-telegram-bot-api . Le premier package est utilisé pour créer un fichier de configuration .env qui contiendra notre jeton d'accès à l'API. Le deuxième paquetage agit comme un wrapper Node.js pour l'API Telegram Bots, que nous allons utiliser pour ce tutoriel.

1. Configuration du projet

Pour commencer, clonez le référentiel GitHub et ouvrez le projet dans votre éditeur favori. Créez ensuite un fichier .env à la racine de votre projet et ajoutez une seule ligne – TOKEN = yourtoken . Remplacez yourtoken par le jeton que vous avez reçu de BotFather.

Pour vous assurer que la connexion fonctionne, accédez à la racine du projet de votre terminal et exécutez npm start . La commande npm start lancera votre fichier app.js et devrait vous connecter à votre bot. Si vous ne voyez aucune erreur, nous sommes prêts à partir!

2. Créer la première commande de bot

Tout d'abord, nous devons créer le bot en lui transmettant notre jeton d'accès à l'API et en définissant l'option polling sur true . Cela signifie que le bot va vérifier les messages entrants à intervalles réguliers.

 require ('dotenv'). Config ();
const TelegramBot = require ('node-telegram-bot-api');

const token = process.env.TOKEN;

// Instance créée de TelegramBot
const bot = new TelegramBot (jeton, {
   polling: true
});

Maintenant que le bot est créé, examinons l’extrait de code suivant qui représente notre commande / bookmark . Nous définissons un écouteur pour les messages texte entrants, onText et spécifions pour rechercher un message commençant par / bookmark comme nous l'indiquons dans la chaîne regex.

le message commence par / bookmark notre code sera exécuté. Tout d’abord, nous stockons l’ID de discussion, car nous souhaitons pouvoir renvoyer un message à la discussion de cet utilisateur.

Nous vérifions ensuite si l’utilisateur a utilisé la commande correctement. Nous nous attendons à ce qu'une adresse URL soit transmise avec la commande suivante: / bookmark www.google.com .

Si aucune URL n'est spécifiée, nous renvoyons un message au chatID demandant à l'utilisateur de nous fournir une URL. S'ils envoient une URL, nous la stockons et leur envoyons un message de succès.

 // Listener (gestionnaire) pour l'événement de télégramme / signet.
bot.onText (/  / bookmark /, (msg, match) => {
   const chatId = msg.chat.id;
   const url = match.input.split ('') [1];
   // 'msg' est le message reçu de Telegram
   // 'match' est le résultat de l'exécution de l'expression rationnelle ci-dessus sur le contenu du texte
   // du message

   if (url === non défini) {
       bot.sendMessage (
           chatId,
           'S'il vous plaît fournir l'URL de l'article!',
       )
       revenir;
   }

   URLs.push (url);
   bot.sendMessage (
       chatId,
       "L'URL a été enregistrée avec succès!",
   )
});

Vous avez peut-être remarqué que nous utilisons deux paramètres pour la fonction de rappel msg et correspondent à . La propriété msg représente le message complet que vous recevez, alors que match représente le résultat de l'expression régulière que nous avons définie. L'image ci-dessous vous montre l'intégrale msg et après ---- elle vous montre le match .

Quand nous essayez notre commande dans le chat avec le bot, nous obtenons le résultat suivant:

Si vous voyez le même résultat, félicitations! Vous venez de créer votre première commande de bot. Jetons un coup d’œil aux options plus avancées comme l’envoi de claviers avec des options prédéfinies.

3. Options de clavier

Nous savons maintenant comment créer une commande personnalisée. Examinons de plus près les options du clavier. Il est possible d'envoyer un clavier prédéfini avec votre commande pour limiter les options de l'utilisateur. Cela peut être aussi simple que de restreindre l’utilisateur à répondre avec Oui ou Non .

3.1 Clavier normal

Jetons un coup d’œil à l’extrait de code suivant. Nous avons ajouté un troisième paramètre à notre fonction bot.sendMessage . Cet objet définit les options de notre clavier. Si vous examinez de plus près reply_markup.keyboard vous trouvez un tableau contenant davantage de tableaux. Chaque tableau représente une ligne avec des options. Cela vous aide avec les options de formatage plus importantes ou avec un texte de bouton plus long.

 // Listener (gestionnaire) pour présenter différentes dispositions de clavier.
bot.onText (/  / keyboard /, (msg) => {
   bot.sendMessage (msg.chat.id, 'Disposition du clavier alternatif', {
       'reply_markup': {
           «clavier»: [['Sample text', 'Second sample']['Keyboard']['I'm robot']],
           resize_keyboard: true,
           one_time_keyboard: true,
           force_reply: true,
       }
   });
});

Ce morceau de code donne le résultat suivant lors de l'envoi d'un message / keyboard à notre bot

De plus, nous pouvons également définir des claviers en ligne avec des données supplémentaires par option.

3.1 Clavier en ligne

Un clavier en ligne sera affiché dans le chat et non sous la zone de saisie du message. Comme nous voulons étiqueter les URL que nous soumettons, nous pouvons le faire en montrant à l'utilisateur les catégories disponibles. Voici à quoi ressemble notre clavier:

Voyons le code ci-dessous. La reply_markup définit maintenant la propriété inline_keyboard . Le reste du balisage reste le même. Chaque tableau représente une ligne. Cependant, au lieu de simplement passer du texte, nous pouvons également passer un objet avec text et callback_data pour savoir quelle option vous avez sélectionnée.

 // Listener (gestionnaire) pour les télégrammes / événement de label
bot.onText (/  / label /, (msg, match) => {
   const chatId = msg.chat.id;
   const url = match.input.split ('') [1];

   if (url === non défini) {
       bot.sendMessage (
           chatId,
           'S'il vous plaît fournir l'URL de l'article!',
       )
       revenir;
   }

   tempSiteURL = url;
   bot.sendMessage (
       chatId,
       "L'URL a été enregistrée avec succès!",
       {
           reply_markup: {
               inline_keyboard: [[
                   {
                       text: 'Development',
                       callback_data: 'development'
                   }, {
                       text: 'Lifestyle',
                       callback_data: 'lifestyle'
                   }, {
                       text: 'Other',
                       callback_data: 'other'
                   }
               ]]
           }
       }
   )
});

La section suivante explique comment utiliser le gestionnaire pour recevoir des données de rappel.

3.2 Rappel depuis le clavier

Si nous voulons recevoir des données de rappel, nous devons écouter ce type d’événement.

 / / Listener (handler) pour les données de rappel depuis la commande / label
bot.on ('callback_query', (callbackQuery) => {
   const message = callbackQuery.message;
   const category = callbackQuery.data;

   URLLabels.push ({
       url: tempSiteURL,
       label: catégorie,
   });

   tempSiteURL = '';

   bot.sendMessage (message.chat.id, `l'URL a été étiqueté avec la catégorie" $ {category} "`);
});

La propriété de message sur callbackQuery contient l'intégralité du message de l'utilisateur. La propriété data contient nos données de rappel de catégorie.

Vous avez peut-être déjà détecté une erreur de conception. Et si nous avons deux commandes qui renvoient des données de rappel? Vous pourriez obtenir un comportement ou des réponses très étranges.

Par conséquent, il est recommandé de renvoyer un objet JSON sous forme de chaîne contenant également une étiquette pour identifier la commande à laquelle les données de rappel appartiennent. Examinez les meilleures pratiques suivantes:

 // Options du clavier en ligne
const inlineKeyboard = {
   reply_markup: {
       inline_keyboard: [
           [
               {
                   text: 'YES',
                   callback_data: JSON.stringify({
                       'command': 'mycommand1',
                       'answer': 'YES'
                   })
               },
               {
                   text: 'NO',
                   callback_data: JSON.stringify({
                       'command': 'mycommand1',
                       'answer': 'NO'
                   })
               },
           ]
       ]
   }
};

Vous pouvez utiliser les données de l’option de la commande pour passer à la logique applicative spécifique à cette commande.

Nous sommes sur le point de devenir Telegram Bot jedis. Explorons les requêtes de données pour mieux maîtriser la connaissance.

3.3 Demandes de données – Numéro de téléphone

Il est possible de demander des données, telles que le numéro de téléphone d’une personne ou sa géolocalisation. Pour ce didacticiel, nous montrons comment demander un numéro de téléphone avec un clavier alternatif.

 // Disposition du clavier pour demander un accès à un numéro de téléphone
const requestPhoneKeyboard = {
   "reply_markup": {
       "one_time_keyboard": true,
       "clavier": [[{
           text: "My phone number",
           request_contact: true,
           one_time_keyboard: true
       }]["Cancel"]]
   }
};

// Listener (handler) pour récupérer le numéro de téléphone
bot.onText (/  / phone /, (msg) => {
   bot.sendMessage (msg.chat.id, 'Pouvons-nous avoir accès à votre numéro de téléphone?', requestPhoneKeyboard);
});

L'utilisateur recevra la demande suivante sur son chat:

En cliquant sur le bouton Mon numéro de téléphone vous obtenez le numéro de téléphone suivant:

Voici comment cela se passe après avoir donné l'accès:

Enfin! Vous êtes un Telegram Bot Jedi pleinement instruit. Pour l'instant, vous pouvez trouver plus d'informations et de ressources ici:

Restez à l'écoute ici aussi – nous reviendrons le mois prochain avec un didacticiel qui approfondira les fonctionnalités avancées de l'API Telegram.

Fullstack Blockchain Developer à TheLedger.be avec une passion pour la crypto-atmosphère.