Erstellen Sie mit Nodejs und Standard Library in 10 Minuten einen persönlichen Facebook Messenger Bot

Wäre es nicht großartig, einen persönlichen Chatbot zu haben, der dir den ganzen Tag über coole Sachen schickt? Vielleicht aktualisieren Sie den Status Ihrer Heimgeräte oder senden Sie niedliche Katzenbilder von Reddit?

Lassen Sie uns einen erstellen, der Ihnen die Top-Beiträge Ihrer bevorzugten Subreddits sendet. Sie können es natürlich mit allen Inhalten erweitern, die Sie senden möchten.

Der Bot sendet Ihnen Top-Beiträge von den von Ihnen angegebenen Subreddits

Dafür brauchen wir drei Dinge:

  1. Facebook-Seite Ein Facebook Messenger-Bot ist einer Facebook-Seite zugeordnet. Sie müssen sich als Entwickler anmelden und dann eine Seite erstellen.
  2. Dialogflow Dialogflow ist ein Google-Unternehmen und hilft bei der NLP (Natural Language Processing). Dies hilft später, wenn Sie Ihren Bot erweitern möchten, um auf bestimmte Dinge zu reagieren.
  3. Code in der Standardbibliothek Code in der Standardbibliothek ist das Beste seit geschnittenem Brot und hilft Ihnen, Code in der Cloud auszuführen. Dies wird das Gehirn unserer Operation sein.

Jetzt fangen wir an.

Facebook-Seite einrichten

Gehen Sie zu developer.facebook.com und melden Sie sich mit Ihren Facebook-Anmeldeinformationen an. Sobald Sie angemeldet sind, klicken Sie auf Erste Schritte und befolgen Sie die Anweisungen zum Hinzufügen einer neuen App.

Erstellen Sie eine neue App im FB Developer Portal

Geben Sie Ihrer App einen Namen. Dies ist der Name, von dem Sie Ihre Benachrichtigungen erhalten. Mach es cool, wie Darth Vader.

Navigieren Sie dann zur Registerkarte Dashboard im Menü der linken Leiste. Scrollen Sie nach unten, um Messenger zu finden, und wählen Sie Einrichten. Bevor Sie Ihre Messenger-Integration hinzufügen können, müssen Sie eine Facebook-Seite erstellen.

Wählen Sie auf der Registerkarte

Dadurch gelangen Sie zu Facebook. Befolgen Sie die Anweisungen, um eine Community- oder öffentliche Personenseite zu erstellen.

Erstellen Sie eine Community- oder öffentliche Facebook-Seite

Wechseln Sie nach dem Erstellen Ihrer Seite zurück zum FB Developer-Portal und aktualisieren Sie die Seite. Ihre Seite sollte jetzt in der Dropdown-Liste "Seite auswählen" aufgeführt sein.

Aktualisieren Sie die Seite und wählen Sie dann Ihren Facebook-Seitennamen aus der Dropdown-Liste aus, um ein Token zu generieren

Lassen Sie uns nun Dialogflow einrichten. Klicken Sie auf Zur Konsole wechseln und melden Sie sich mit Ihren Google-Anmeldeinformationen an.

Dialogflow verwendet die Verarbeitung natürlicher Sprache, um die Chat-Konversation zu verstehen

Klicken Sie auf Agent erstellen und geben Sie die Details ein. Geben Sie Ihrem Agenten einen Namen. Es kann der gleiche Name sein wie Ihre Facebook-Seite.

Geben Sie Ihrem Agenten einen Namen und wählen Sie die richtige Zeitzone

Wenn Ihr Agent erstellt wird, werden automatisch zwei Absichten hinzugefügt. Klicken Sie auf Standard-Begrüßungsabsicht, um es zu bearbeiten.

Sie können weitere Absichten hinzufügen, wenn Sie möchten.

Fügen Sie im Abschnitt Ereignisse das Ereignis FACEBOOK_WELCOME hinzu. Auf diese Weise kann Ihr Bot den Benutzer erkennen, wenn er zum ersten Mal mit dem Bot interagiert.

Facebook hinzufügen Willkommen bei Veranstaltungen

Scrollen Sie auf der Seite nach unten und löschen Sie die Standardantworten, indem Sie auf das Papierkorbsymbol klicken, da wir dem Benutzer über unseren Code antworten.

Klicken Sie auf das Papierkorbsymbol, um die Standardantworten zu löschen

Scrollen Sie weiter nach unten und aktivieren Sie die Erfüllung. Dadurch wird sichergestellt, dass alle Anforderungen über unsere Chatbot-Funktion für Code on Standard Library weitergeleitet werden.

Aktivieren Sie Fulfillment, um Nachrichten auf Ihrem Webhook zu empfangen

Als nächstes müssen wir den Facebook Messenger mit Dialogflow verbinden. Klicken Sie auf Integrationen.

Durch Integrationen kann der Agent mit einer Vielzahl verschiedener Dienste arbeiten, einschließlich Facebook Messenger

Aktivieren Sie die Messenger-Integration. Dies öffnet ein modales Fenster. Sie müssen hier zwei Dinge eingeben. Erstens das Verifikationstoken, bei dem es sich um einen beliebigen Text handeln kann, und zweitens das Seitenzugriffstoken.

Wechseln Sie zum Facebook Developer Portal und kopieren Sie das Page Access Token.

Wählen Sie Ihren Seitennamen aus der Dropdown-Liste aus, um ein Seitenzugriffstoken zu generieren

Fügen Sie das Seitenzugriffstoken in das modale Dialogflussfenster ein und geben Sie Ihr Bestätigungstoken ein. Klicken Sie auf die Schaltfläche START, um die Integration zu starten. Klicken Sie nun auf das Zwischenablagesymbol, um die Rückruf-URL zu kopieren.

Klicken Sie auf das Symbol Zwischenablage, um die Rückruf-URL zu kopieren

Wechseln Sie jetzt zum Facebook Developer Portal. Es ist Zeit, die Webhooks-Integration einzurichten. Wählen Sie Setup Webhooks unter dem Abschnitt Token-Generierung. Fügen Sie die von Ihnen kopierte URL in das Feld Rückruf-URL ein und geben Sie Ihr im vorherigen Schritt angegebenes Bestätigungstoken ein. Kreuzen Sie alle Abonnementfelder an.

Es sind nicht alle erforderlich, aber Dialogflow kümmert sich um die unnötigen und sendet Ihnen nur die relevanten

Klicken Sie auf Überprüfen und Speichern. Wenn Sie alles richtig eingerichtet haben, sollte ein grünes Häkchen mit Vollständig angezeigt werden. Wählen Sie nun Ihren Seitennamen aus der Dropdown-Liste und klicken Sie auf Abonnieren.

Wählen Sie Ihren Seitennamen aus der Dropdown-Liste und klicken Sie dann auf Abonnieren, um Ihre Seite zu abonnieren

Es gibt noch ein paar weitere Dinge, die Sie benötigen, um das Setup abzuschließen. Gehen Sie zu Einstellungen> Basis, fügen Sie eine URL für Datenschutzrichtlinien hinzu und wählen Sie eine Kategorie für Ihre App aus. Die URL der Datenschutzrichtlinie kann eine beliebige gültige URL sein.

Sie können auch die im Code enthaltenen Datenschutzrichtlinien verwenden, wie im Abschnitt Code in der Standardbibliothek unten angegeben
Geben Sie die Datenschutz-URL ein und wählen Sie eine Kategorie für Ihre Seite

Speichern Sie die Änderungen und schalten Sie die Statusschaltfläche ein, um Ihre App live zu schalten.

Das Symbol zeigt den Status als Live an. Sie könnten versucht sein zu glauben, dass dies bedeutet, dass die ganze Welt Ihre App sehen und mit ihr interagieren kann. Nee.

Ihre App ist live

Code für die Einrichtung der Standardbibliothek

Hier lebt unser Code, der die gesamte Kommunikation ermöglicht. Wenn wir eine Nachricht an unseren Bot auf Facebook senden, wird diese zuerst an Dialogflow gesendet. Dialogflow leitet es an die richtige Absicht weiter und leitet es dann an unsere Funktion weiter - diese Funktion.

Suche zuerst nach fb-messenger-bot in Community-API-Quellen. Klicken Sie auf Neue API erstellen.

Nach der Erstellung werden drei Dateien im Funktionsordner angezeigt.

  1. __main __. js Die Hauptfunktion ruft die Reddit-Beiträge ab und sendet sie an die Benutzer. Ändern Sie das Multi-Objekt oben in der Funktion, um die Subreddits anzupassen.
  2. webhook.js Diese Funktion verarbeitet alle Webhook-Anforderungen von Dialogflow. Hier fügen Sie die benutzerdefinierten Absichten hinzu, wenn Sie die Bot-Funktionalität erweitern möchten.
  3. privacy.js Wussten Sie, dass Code on Standard Library-Funktionen HTML-Dateien zurückgeben können? Dies ist eine Datenschutzdatei, die Sie im FB Developer Portal verwenden können. Die URL sieht ungefähr so ​​aus wie https://username.lib.id/[email protected]/privacy. Sie sollten Ihre eigene E-Mail am Ende dieses Dokuments hinzufügen.

Navigieren Sie jetzt zur Datei env.json und füllen Sie die Umgebungen mit Ihrem Standardbibliothekstoken und dem Facebook-Seitenzugriffstoken.

Um Ihr Standardbibliothekstoken abzurufen, platzieren Sie den Cursor zwischen den gelben Anführungszeichen und klicken Sie mit der rechten Maustaste. Wählen Sie Ihr Standardbibliothekstoken aus dem Dropdown-Menü aus, und die Variable sollte automatisch ausgefüllt werden.
Geben Sie Ihr FB-Zugriffstoken und das Standardbibliothekstoken in Ihre Datei env.json ein

Nachdem Sie die Datei env.json gespeichert haben, klicken Sie auf Ausführen.

Klicken Sie auf Ausführen, um den Dienst bereitzustellen
Denken Sie daran, dass Sie jedes Mal, wenn Sie Code ändern, diesen speichern und dann ausführen müssen, um den neuen Code bereitzustellen.

Kopieren Sie nach der Bereitstellung die angezeigte API-Endpunkt-URL. Dies ist Ihr Webhook-Endpunkt.

Lassen Sie uns nun die Dialogflow-Einrichtung abschließen. Wechseln Sie zu Dialogflow, klicken Sie auf Erfüllung und aktivieren Sie den Webhook.

Aktivieren Sie den Webhook und fügen Sie eine URL hinzu

Fügen Sie die kopierte URL mit / webhook / hinzu und klicken Sie unten auf der Seite auf SPEICHERN. Ihre Webhook-URL sollte wie folgt aussehen: https://username.lib.id/[email protected]/webhook/

Hängen Sie / webhook / an Ihre Basis-URL an

Wir sind fast fertig. Jetzt müssen wir nur noch unseren Bot auf der Facebook-Seite aktivieren. Gehen Sie zu Ihrer Facebook-Seite und klicken Sie auf Schaltfläche hinzufügen. Wählen Sie Nachricht senden, vervollständigen Sie die Details und speichern Sie.

Fügen Sie Ihrer Facebook-Seite eine Schaltfläche zum Senden von Nachrichten hinzu

Wenn Sie nun mit der Maus über die Schaltfläche "Nachricht senden" fahren, wird ein Dropdown-Menü angezeigt. Klicken Sie auf die Schaltfläche Test.

Klicken Sie auf die Schaltfläche Test, um Ihren Bot zu testen

Dadurch wird ein Chat mit der Schaltfläche Erste Schritte geöffnet. Klicken Sie darauf und wenn Sie alles richtig eingerichtet haben, werden Sie mit „Woohoo!“ Begrüßt. Willkommen {Name}. Sie wurden der Datenbank hinzugefügt. “

Dies bedeutet, dass Sie als Benutzer in Ihrer Funktion für Code im lokalen Speicher der Standardbibliothek hinzugefügt wurden.

Wenn Sie Ihrem Bot erneut die Nachricht "Hi" senden, antwortet er mit "Hi {Name}, Sie wurden bereits zur Datenbank hinzugefügt."

Nun zum Einrichten von Aufgaben.

Aufgaben zum Code in der Standardbibliothek

Eine der coolsten Funktionen von Code on Standard Library sind Aufgaben. Durch das Einrichten von Aufgaben wird Ihr Code automatisch nach einem bestimmten Zeitplan ausgeführt.

Klicken Sie auf Aufgaben, um Ihren Code so einzurichten, dass er nach einem Zeitplan ausgeführt wird
Ich habe derzeit die Funktion für vier Benachrichtigungen pro Tag eingerichtet. Sie können es auf eine beliebige Nummer ändern. Denken Sie daran, dass Sie auch die Variable max_notifications oben in der Funktion ändern und die gleiche Anzahl wiederholbarer Aufgaben in die Cron-Spezifikation einfügen müssen.

Wählen Sie im Aufgabenfenster Ihre Bot-Funktion aus, um einen Zeitplan hinzuzufügen.

Wählen Sie Ihre Funktion aus, um einen Aufgabenplan hinzuzufügen

Sie können den Aufgabenplan über die Dropdown-Liste Zeitplan einrichten. Aber wir wollen etwas mehr Kontrolle, also verwenden wir Advanced (cron).

Klicken Sie auf Erweitert (Cron), um Cron-Ausdrücke für den Aufgabenplan zu verwenden

Der Cron-Ausdruck kann sehr verwirrend sein. Der Ausdruck nimmt 5 Werte an - * * * * *. Der erste ist der Minutenwert und der zweite ist der Stundenwert.

Wenn Sie also 30 5,8,11,15 * * * eingeben, werden 4 Aufgaben ausgeführt, die täglich um 05:30, 08:30, 11:30 und 15:30 Uhr ausgeführt werden. Die Zeiten sind in UTC angegeben, daher müssen Sie Ihren Zeitzonenversatz für die richtige Ortszeit addieren oder subtrahieren.

Da ich in Indien lebe und mein Zeitzonenversatz +05: 30 beträgt, läuft dieser Zeitplan um 11:00, 14:00, 17:00 und 21:00 Uhr Ortszeit.

Wenn der Cron-Ausdruck gültig ist, werden die nächsten drei Aufrufzeiten darunter angezeigt

Klicken Sie auf Aufgabe planen und Sie sind fertig. Sie sollten jetzt zu den festgelegten Zeiten Benachrichtigungen auf Ihrem Messenger erhalten.

Wenn Sie den Aufgabenplan testen möchten, wählen Sie einmal pro Minute. Wenn Sie die richtigen Nachrichten erhalten haben, schalten Sie sie aus und verwenden Sie den obigen Cron-Ausdruck oder ähnliches, um den Zeitplan anzupassen.

Herzliche Glückwünsche! Sie haben jetzt einen persönlichen Chatbot. Ich werde in den kommenden Monaten weitere Tutorials hinzufügen, welche anderen interessanten Dinge Sie mit einem Chatbot tun können.

Schauen Sie sich Erstellen Sie eine Alexa-Radio-Fähigkeit an, wenn Sie mit Ihren personalisierten Radiosendern eine Alexa-Fähigkeit aufbauen möchten.