A propos de l’auteur

Slobodan Stojanović est CTO de l’agence montréalaise de développement logiciel Cloud Horizon et organisateur des Meetups JS Belgrade. Il aime JavaScript et Open Source …
En savoir plus sur Slobodan ↬

Au cours des derniers mois, les robots de discussion sont devenus très populaires grâce à Slack, Telegram et Facebook Messenger. Mais l’idée du chat bot n’est pas du tout nouvelle.

Une surface de chat bot est mentionnée dans le célèbre test de Turing en 1950. En 1966, il y avait Eliza, une simulation d’un psychothérapeute voyou et un des premiers exemples de traitement primitif du langage naturel. Cela a été suivi par Parry en 1972, une simulation d’une personne atteinte de schizophrénie paranoïde (et bien sûr oui) Parez avec Eliza).

En 1983, il y avait un livre intitulé La barbe du policier est à moitié construitegénéré par Racter, un programme informatique d’intelligence artificielle qui a généré une prose aléatoire en anglais et a ensuite été publié sous forme de chat bot.

L’une des plus célèbres était Alice (uneartificiellement linguistique jel’Internet cl’ordinateur entity), publié en 1995. Il a échoué au test de Turing mais a remporté le Prix ​​Loebner 3 fois. En 2005 et 2006, le même prix a été remporté par deux personnages de robots Jabberwacky.

Et en 2014, Slackbot a rendu les robots de discussion à nouveau populaires. En 2015, Telegram, puis Facebook Messenger, ont publié la prise en charge des robots de discussion. En 2016, Skype a fait de même, et Apple et quelques autres entreprises ont annoncé encore plus de plates-formes de chat bot.

Que devez-vous savoir pour créer un chat bot?

La réponse à cela dépend bien sûr en grande partie de ce que vous voulez construire.

Dans la plupart des cas, vous pouvez créer un chat bot sans en savoir beaucoup sur l’intelligence artificielle (IA), soit en l’évitant entièrement, soit en utilisant certaines bibliothèques existantes pour l’IA de base.

Il en va de même pour le traitement du langage naturel (NLP). C’est plus important que l’IA, mais vous pouvez créer un chat bot à l’aide d’une bibliothèque PNL ou, pour certaines plates-formes, simplement en utilisant des boutons et des éléments d’interface utilisateur au lieu d’un traitement de texte.

Et enfin, avez-vous même besoin de compétences en programmation? Il existe de nombreux constructeurs de robots visuels, donc probablement pas. Mais cela peut être utile.

Comment créer un bot Facebook Messenger

Ceci est un article sur la création de robots de discussion. Maintenant, entrons enfin dans cela. Créons un simple bot Facebook Messenger.

Nous utiliserons Node.js, mais vous pouvez créer un chat bot en utilisant n’importe quel langage de programmation qui vous permet de créer une API Web.

Pourquoi Node.js? Parce qu’il est parfait pour les robots de discussion: avec hapi.js, Express, etc., vous pouvez créer rapidement une API simple. Il prend en charge la messagerie en temps réel (RTM) pour les bots Slack RTM. et c’est facile à apprendre (au moins assez facile pour faire un simple chat bot).

Facebook a déjà écrit un exemple de chat bot dans Node.js. disponible sur GitHub. Si vous examinez le code, vous constaterez qu’il utilise le framework Express et dispose de trois webhooks (pour la révision, l’authentification et la réception de messages). Vous verrez également les réponses envoyées à l’aide du module de requête Node.js.

Cela semble facile?

Il est. Cependant, cet exemple de bot complet contient 839 lignes de code. Ce n’est pas beaucoup et vous n’en avez probablement besoin que de la moitié, mais il y a encore trop de code standard pour commencer.

Et si je vous disais que nous pourrions obtenir le même résultat avec seulement cinq lignes de JavaScript?

var botBuilder = require('claudia-bot-builder');

module.exports = botBuilder(function (request) {
  return 'Thanks for sending ' + request.text;
});

Ou encore moins si vous utilisez ECMAScript 6:

const botBuilder = require('claudia-bot-builder');

module.exports = botBuilder(request => 'Thanks for sending ${request.text}');

Apprenez à connaître le Claudia Bot Builder

Avec Claudia Bot Builder, les développeurs peuvent créer des robots de discussion pour Facebook Messenger, Telegram, Skype et Slack et les déployer sur Lambda et API Gateway d’Amazon Web Services (AWS) en quelques minutes.

L’idée clé derrière le projet est de supprimer tout le code pour les tâches standard et d’infrastructure générale afin que vous puissiez vous concentrer sur l’écriture de la partie vraiment importante du bot – votre flux de travail d’entreprise. Le Claudia Bot Builder s’occupe de tout le reste.

Pourquoi AWS Lambda? C’est un match parfait pour les robots de discussion: créer une API simple est facile; Il répond beaucoup plus rapidement à la première requête qu’une instance Heroku gratuite. et c’est vraiment pas cher. Le premier million de demandes par mois est gratuit et le prochain million de demandes ne coûte que 0,20 $!

C’est aussi simple que d’utiliser Claudia Bot Builder pour créer un bot Facebook Messenger:

Construisons un robot Space Explorer

Space Explorer est un simple chat bot de messagerie qui utilise l’API de la NASA pour extraire des données et des images sur l’espace.

Avant de commencer, créez une page et une application Facebook et ajoutez l’intégration de Messenger comme celle de Facebook « A débuté« conduite.

Créez ensuite un fichier nommé bot.js avec le contenu suivant:

const botBuilder = require('claudia-bot-builder');

module.exports = botBuilder(request => `Hello from space explorer bot! Your request was: ${request.text}`);

Installez ces dépendances:

npm init;

npm install claudia-bot-builder -S;

npm install claudia -g;

Créez une fonction Lambda et suivez les instructions de la vidéo ci-dessus pour la connecter à votre application Facebook:

claudia create --region us-east-1 --api-module bot --configure-fb-bot

C’est ça! Vous avez créé votre premier chat bot pour Facebook Messenger.

Lorsque vous envoyez un message sur votre page, votre bot répond. Mais la réponse est trop simple. Ajoutons quelque chose de plus intéressant!

Intégrez l’API de la NASA

Avant de continuer, visitez Portail API de la NASA et obtenez une clé API.

Ajoutez ensuite votre clé API en tant que nasaApiKey Variable de niveau dans la passerelle API. Vous pouvez le faire via l’interface utilisateur ou en exécutant la commande suivante:

aws apigateway create-deployment 
    --rest-api-id API_ID --stage-name latest 
    --variables nasaApiKey=YOUR_NASA_API_KEY

Ici, API_ID est votre ID API du claudia.json Fichier qui a été généré automatiquement à l’étape précédente.

Ajoutons une meilleure réponse aux messages texte. Claudia Bot Builder a un simple générateur de message de modèle Facebook Messenger (le La documentation est sur GitHub).

const botBuilder = require('claudia-bot-builder');
const fbTemplate = botBuilder.fbTemplate;
const rp = require('minimal-request-promise');

module.exports = botBuilder((request, originalApiRequest) => {
  // If request is not postback
  if (!request.postback)
    // We'll get some basic info about the user
    return rp.get(`https://graph.facebook.com/v2.6/${request.sender}?fields=first_name&access_token=${originalApiRequest.env.facebookAccessToken}`)
      .then(response => {
        const user = JSON.parse(response.body)
        // Then let's send two text messages and one generic template with three elements/bubbles
        return [
          `Hello, ${user.first_name}. Welcome to Space Explorer! Ready to start a journey through space?`,
          'What can I do for you today?',
          return new fbTemplate.generic()
            .addBubble(`NASA's Astronomy Picture of the Day`, 'Satellite icon by parkjisun from the Noun Project')
              .addImage('https://raw.githubusercontent.com/stojanovic/space-explorer-bot/master/assets/images/apod.png')
              .addButton('Show', 'SHOW_APOD')
              .addButton('What is APOD?', 'ABOUT_APOD')
              .addButton('Website', 'http://apod.nasa.gov/apod/')
            .addBubble(`Photos from NASA's rovers on Mars`, 'Curiosity Rover icon by Oliviu Stoian from the Noun Project')
              .addImage('https://raw.githubusercontent.com/stojanovic/space-explorer-bot/master/assets/images/mars-rover.png')
              .addButton('Curiosity', 'CURIOSITY_IMAGES')
              .addButton('Opportunity', 'OPPORTUNITY_IMAGES')
              .addButton('Spirit', 'SPIRIT_IMAGES')
            .addBubble('Help & info', 'Monster icon by Paulo Sá Ferreira from the Noun Project')
              .addImage('https://raw.githubusercontent.com/stojanovic/space-explorer-bot/master/assets/images/about.png')
              .addButton('About the bot', 'ABOUT')
              .addButton('Credits', 'CREDITS')
              .addButton('Report an issue', 'https://github.com/stojanovic/space-explorer-bot/issues')
            .get();
        ];
      });
}

Maintenant, notre bot a une belle réponse de bienvenue:

Aperçu du robot Space Explorer
((Grand aperçu)

Bien mieux!

Ensuite, couvrons les publications. Commençons par l’image astronomique du jour de la NASA:

// In case of the 'SHOW_APOD' postback, we'll contact NASA API and get the photo of the day.
if (request.text === 'SHOW_APOD')
  return rp(`https://api.nasa.gov/planetary/apod?api_key=${originalApiRequest.env.nasaApiKey}`)
    .then(response => {
      const APOD = JSON.parse(response.body)
      return [
        `NASA's Astronomy Picture of the Day for ${APOD.date}`,
        `"${APOD.title}", © ${APOD.copyright}`,
        new fbTemplate.image(APOD.url).get(),
        APOD.explanation,
        new fbTemplate.button('More actions:')
          .addButton('Download HD', APOD.hdurl)
          .addButton('Visit website', 'http://apod.nasa.gov/apod/')
          .addButton('Back to start', 'MAIN_MENU')
          .get()
      ]
    });

Et voici les rovers de Mars (curiosité, opportunité et esprit):

// Common API call
function getRoverPhotos(rover, sol, nasaApiKey) {
  // If sol (Mars day) is not defined, take a random one.
  if (!sol)
    sol = (parseInt(Math.random() * 9) + 1) * 100;

  // Contact the API
  return rp(`http://api.nasa.gov/mars-photos/api/v1/rovers/${rover}/photos?sol=${sol}&api_key=${nasaApiKey}`)
    .then(response => {
      let rawBody = response.body;

      let roverInfo = JSON.parse('' + rawBody);
      // Create generic template with up to 10 photos.
      let photos = roverInfo.photos.slice(0, 10);
      let roverImages = new fbTemplate.generic();

      photos.forEach(photo => {
        return roverImages.addBubble(photo.rover.name, 'At ' + photo.earth_date + ' (sol ' + photo.sol + '), using ' + photo.camera.full_name)
          .addImage(photo.img_src)
          .addButton('Download', photo.img_src)
      });

      // Send the message.
      return [
        `${roverInfo.photos[0].rover.name} rover`,
        `Landing Date: ${roverInfo.photos[0].rover.landing_date} nTotal photos: ${roverInfo.photos[0].rover.total_photos}`,
        roverImages.get(),
        new fbTemplate.button('More actions:')
          .addButton('Show newest photos', `PHOTOS_${rover}_${roverInfo.photos[0].rover.max_sol}`)
          .addButton('Visit Wikipedia', `https://en.wikipedia.org/wiki/${rover}_(rover)`)
          .addButton('Back to start', 'MAIN_MENU')
          .get()
      ];
    })
    .catch(err => {
      // If the selected sol doesn't have any photos, take the photos from sol 1000.
      console.log(err);
      return getRoverPhotos(rover, 1000, nasaApiKey);
    });
}

// Curiosity photos
if (request.text === 'CURIOSITY_IMAGES')
  return getRoverPhotos('curiosity', null, originalApiRequest.env.nasaApiKey);

// Opportunity photos
if (request.text === 'OPPORTUNITY_IMAGES')
  return getRoverPhotos('opportunity', null, originalApiRequest.env.nasaApiKey);

// Spirit photos
if (request.text === 'SPIRIT_IMAGES')
  return getRoverPhotos('spirit', null, originalApiRequest.env.nasaApiKey);

// Rover photos by sol (Mars day)
if (request.text.indexOf('PHOTOS_') === 0) {
  const args = request.text.split('_')
  return getRoverPhotos(args[1], args[2], originalApiRequest.env.nasaApiKey);
}

Enfin, ajoutez du contenu statique:

// About Astronomy Picture of the Day
if (request.text === 'ABOUT_APOD')
  return [
    `The Astronomy Picture of the Day is one of the most popular websites at NASA. In fact, this website is one of the most popular websites across all federal agencies. It has the popular appeal of a Justin Bieber video.`,
    `Each day a different image or photograph of our fascinating universe is featured, along with a brief explanation written by a professional astronomer.`,
    new fbTemplate.button('More actions:')
      .addButton('Show photo', 'SHOW_APOD')
      .addButton('Visit website', 'http://apod.nasa.gov/apod/')
      .addButton('Back to start', 'MAIN_MENU')
      .get()
  ];

// About the bot
if (request.text === 'ABOUT')
  return [
    `Space Explorer is simple Messenger chat bot that uses NASA's API to get the data and images about the space`,
    `It's created for fun and also as a showcase for Claudia Bot Builder, node.js library for creating chat bots for various platform and deploying them on AWS Lambda`,
    new fbTemplate.button('More actions:')
      .addButton('Claudia Bot Builder', 'https://github.com/claudiajs/claudia-bot-builder')
      .addButton('Source code', 'https://github.com/stojanovic/space-explorer-bot')
      .get()
  ];

// Finally, credits
if (request.text === 'CREDITS')
  return [
    'Claudia Bot Builder was created by Gojko Adžić, Aleksandar Simović and Slobodan Stojanović',
    'Icons used for the bot are from the Noun Project',
    '- Rocket icon by misirlou, n- Satellite icon by parkjisun, n- Curiosity Rover icon by Oliviu Stoian, n- Monster icon by Paulo Sá Ferreira',
    'This bot was created by Claudia Bot Builder team',
    new fbTemplate.button('More actions:')
      .addButton('Claudia Bot Builder', 'https://github.com/claudiajs/claudia-bot-builder')
      .addButton('The Noun Project', 'https://thenounproject.com')
      .addButton('Source code', 'https://github.com/stojanovic/space-explorer-bot')
      .get()
  ];

Résultat

Après quelques ajustements mineurs, notre code devrait ressembler à ceci Source sur GitHub.

Vous pouvez le voir en direct sur votre site ou sur le Page du robot Space Explorer sur Facebook Messenger.

Découvrez-le en direct sur FB Messenger

C’est ça! Vous avez créé avec succès votre premier chat bot Claudia Bot Builder. C’était facile, n’est-ce pas?

Maintenant, construisez des robots de discussion plus sympas.

Remarques de clôture

J’ai choisi Facebook Messenger comme point de départ car la plupart d’entre nous le connaissent. Mais nous avons choisi Slack comme premier bot car toute notre équipe utilise Slack au quotidien. Nous avons donc décidé d’en construire un simple Bot de suivi des vacances par équipe directement dans Slack avec Claudia Bot Builder, Node.js, MariaDB et AWS Lambda.

En fonction de votre idée, de votre marché cible et des plates-formes avec lesquelles vous êtes le plus familier, vous pouvez commencer par toute autre plate-forme prenant en charge les robots de discussion.

Visiter le Site web de Claudia Découvrez comment développer et déployer des microservices et des API AWS Lambda de base. Et faites-nous savoir si vous construisez quelque chose de cool avec.

Un grand merci à Lav Crnobrnja, Marko Kažić, Goran Gajić, Bojan Matić et Vuk Nikolić pour l’aide et les commentaires sur l’article!

lecture supplémentaire sur SmashingMag:

Éditorial fracassant(rb, il, yk, al)



Source link

Recent Posts