Facebooks "messenger bots" -funktion er ikke noget nyt, og der findes allerede mange fantastiske robotter. Imidlertid er ressourcerne til præcis, hvordan du opbygger din helt egen bot, knappe og mangler i forklaring til personer, der er nye til Facebook Graph API. Messenger-robotter kræver nu også, at du bruger en SSL-sikret webhook-tilbagekaldsadresse (mere om det senere), og opsætning af SSL er ikke for alle, og det koster også penge.
I denne artikel vil jeg gå igennem hele processen med at oprette en simpel Facebook messenger bot, fordi Facebooks egen dokumentation er lidt dårligt forklaret. Vi vil oprette en cloud app, der bruger https-protokollen, kode bot i Node.js (som er et javascript, server-side sprog), brug git til at skubbe koden til cloud applikationen og teste den ud på Facebook Messenger.
Setup Bot
Du skal bruge Node installeret på din bærbare computer. Hvis du ikke gør det, skal du gå til Node-webstedet for at downloade og installere det.
Når du er færdig, kan du fortsætte med opsætningen til botten. Følg nedenstående trin:
1. Start terminal.
2. Du har brug for en separat mappe til at holde din kode.
- Lav en ny mappe
mkdir testbot
- Skift din arbejdsmappe til den mappe, du netop har oprettet
cd testbot
3. Næste skal du initialisere nodeprogrammet. npm init
- Du bliver bedt om at indtaste oplysninger om din ansøgning, brug bare standardindstillingerne ved at trykke på Enter for alt.
4. Installer pakker npm install express body-parser request --save
- Kommandoen løber og giver nogle advarsler; ignorere dem.
5. I Finder skal du åbne mappen " testbot ", du oprettede, og find filen " package.json ". Åbn dette i en editor som Sublime Text.
6. I denne fil skal vi tilføje en linje "start": "node index.js"
- Glem ikke at tilføje en ", " i slutningen af den foregående linje.
7. Opret derefter en ny fil i Sublime Text, og indsæt følgende kode inde i den:
[Js]
var express = kræver (udtrykt)
var bodyParser = kræver ('body-parser');
var request = kræve ('request');
var app = ekspres ();
app.use (bodyParser.urlencoded ({extended: false}));
app.use (bodyParser.json ());
app.listen ((process.env.PORT || 3000));
app.get ('/', funktion (req, res) {
res.send ('Dette er TestBot Server');
});
app.get ('/ webhook', funktion (req, res) {
hvis (req.query ['hub.verify_token'] === 'testbot_verify_token') {
res.send (req.query [ 'hub.challenge']);
} ellers {
res.send ('Ugyldig bekræftelsestoken');
}
});
[/ Js]
Gem denne fil som index.js
Bemærk: I linje 13 er værdien af 'hub.verify_token' angivet som ' testbot_verify_token', husk denne værdi, som den vil blive brugt, når du opretter webhook i Facebook.
Opret Git Repository
Nu hvor vi har oprettet vores bots tilbagekaldshåndtering, skal vi skubbe koden til Heroku. For det skal vi oprette et git repository i vores bibliotek.
Bemærk: "git" er et versionsstyringssystem til filer og software kode. Du kan læse mere om det på Wikipedia.
Oprettelse af et git repository er nemt, og tager kun et par Terminal kommandoer.
Bemærk: Sørg for at du er inde i " testbot " -kataloget i Terminal. Du kan gøre dette ved at skrive kommandoen pwd til Terminal.
Følg disse trin for at oprette et git repository:
1. git init
2. git add .
3. git commit -m "Register Facebook Webhook"
Opsætning Heroku
Før vi selv går ind på Facebook's udvikler sider, har vi brug for en tilbagekaldingswebadresse, som Facebook kan tale med. Denne webadresse skal bruge https-protokollen, hvilket betyder at vi skal installere et SSL-certifikat på vores hjemmeside; men det er en begynder guide til Facebook messenger bots, så lad os ikke komplicere ting. Vi bruger Heroku til at distribuere vores kode. Heroku giver dig https webadresser til dine applikationer og har en gratis plan, der opfylder vores (meget grundlæggende) krav.
Gå til Heroku hjemmeside og tilmeld dig selv.
Bemærk: I feltet, der siger "Vælg dit primære udviklingssprog", skal du bruge "Jeg bruger et andet sprog".
Når du er færdig med det, skal du installere Heroku værktøjsbæltet til dit operativsystem (Mac, for mig) og installere det. Dette giver dig adgang til Heroku på din Terminal (eller kommandoprompt, på Windows).
Dernæst vil vi oprette en app på Heroku, som vil holde hele koden til vores bot. Følg nedenstående trin:
1. Start terminal
2. Skriv heroku login
- Du bliver bedt om at indtaste din e-mail og adgangskode.
- Indtast din email, tryk Enter; Indtast derefter din adgangskode, tryk Enter.
- Du vil være logget ind på heroku
3. Skriv heroku create
- Dette vil oprette en app på Heroku og give dig et hyperlink. Bemærk at linket bruger https-protokollen. Nemt, ikke?
4. Nu kan du skubbe din appkode til Heroku git push heroku master
5. Når dette er gjort, er din app grundlæggende live, og du kan besøge linket i din browser for at kontrollere, at alt fungerer fint. Det skal åbne en webside, der siger " Dette er TestBot Server ".
Facebook Setup
Det er på tide at forbinde vores bot til Facebook! Du skal oprette en ny Facebook-side eller bruge en eksisterende, som du ejer. Jeg vil vise dig, hvordan du fortsætter ved at oprette en ny Facebook-side.
1. Gå til Facebook og opret en ny side.
- Du kan oprette en side i hvilken kategori du ønsker. Jeg vælger firma / organisation uden nogen særlig grund.
2. De næste trin, at Facebook viser er valgfri, og kan springes over.
3. Næste, gå over til Facebook Developers 'hjemmeside.
- Højreklik på musen på " Mine apps " og klik derefter på " Tilføj en ny app " fra rullemenuen.
- Klik på " grundlæggende opsætning ", når Facebook beder dig om at vælge en platform.
4. Udfyld detaljerne for din App Navn og kontakt email adresse.
- Vælg " Apps for Pages " i kategorien.
- Klik på " Opret App ID ".
5. Du bliver taget til instrumentbrættet til din app. På sidepanelet navigerer du til " + Tilføj produkter " og vælg " Messenger " ved at klikke på knappen " Kom i gang ".
6. Vælg " Setup Webhooks ".
7. Udfyld de obligatoriske felter, og udskift "URL til tilbagekaldelse" med URL'en til Heroku-appen, bekræft Token med symbolet, der bruges i index.js-filen, og vælg følgende abonnementsfelter:
- message_deliveries
- Beskeder
- message_optins
- messaging_postbacks
Bemærk: Sørg for, at du tilføjer " / webhook " til tilbagekaldelseswebadressen, så index.js udfører den ønskede funktion, når Facebook forsøger at pinge webadressen, det kan verificere "Verificer Token".
8. Klik på " Bekræft og gem ".
9. Klik på " Vælg en side " i afsnittet " Token Generation " og vælg den side, du oprettede tidligere.
Dette vil generere en " Page Access Token ", gem den et eller andet sted; du skal bruge det senere.
10. Derefter bliver du nødt til at lave en POST-forespørgsel til din app ved hjælp af den sideadgangstoken, der blev genereret i det sidste trin. Dette kan nemt gøres i Terminal. Du skal bare køre følgende kommando, og erstatte PAGE_ACCESS_TOKEN med den sideadgangstoken, du genererede .
curl -X POST "//graph.facebook.com/v2.6/me/subscribed_apps?access_token=PAGE_ACCESS_TOKEN"
Du skal modtage et " succes " svar i Terminal.
Mere Heroku Setup
Ja, vi er ikke færdige endnu. Ikke næsten.
1. Gå til Heroku hjemmeside og log ind med dit email-id.
2. Find din app i "dashboard" og klik på den.
3. Naviger til fanen Indstillinger.
4. Klik på " Reveal Config Vars "
5. Tilføj PAGE_ACCESS_TOKEN som en " config var ", og klik på " Tilføj ".
Kodning af den faktiske bot
Nu hvor vi er færdige med det grunne arbejde, kan vi fokusere på, hvad der virkelig betyder noget: at gøre bot reagere på meddelelser. For at starte med, vil vi bare designe en bot, der simpelthen ekko meddelelserne den modtager. Som det viser sig, kræver denne enkle opgave en betydelig del kode for at fungere.
1. Kodning af Message Listener
Før bot kan ekko beskeden, skal den kunne lytte til meddelelser. Lad os gøre det først.
I filen index.js tilføjes følgende kode:
[Js]
app.post ('/ webhook', funktion (req, res) {
var events = req.body.entry [0] .messaging;
for (i = 0; i <events.length; i ++) {
var event = begivenheder [i];
hvis (event.message && event.message.text) {
sendMessage (event.sender.id, {text: "Echo:" + event.message.text});
}
}
res.sendStatus (200);
});
[/ Js]
Hvad denne funktion gør, kontrollerer den for modtagne beskeder, og kontrollerer derefter, om der er tekst i meddelelsen. Hvis den finder tekst i den modtagne besked, kalder den funktionen sendMessage (vist senere), sender afsenderens ID og teksten til at sende tilbage. Det er vigtigt at forstå følgende værdier og hvad de betyder:
- event.message.text er teksten modtaget i meddelelsen. For eksempel, hvis nogen sender meddelelsen "Hej" til vores bot, bliver værdien af event.message.text "Hello".
- event.sender.id er iden til den person, der sendte beskeden til botten. Dette er påkrævet, så botten ved, hvem der skal adressere svaret på.
2. Kodning af sendMessage-funktionen
Lader kode funktionen "sendMessage" nu.
[Js]
funktion sendMessage (modtager, meddelelse) {
anmodning({
url: '//graph.facebook.com/v2.6/me/messages',
qs: {access_token: process.env.PAGE_ACCESS_TOKEN},
metode: 'POST',
json: {
modtager: {id: recipientId},
besked: besked,
}
}, funktion (fejl, respons, krop) {
hvis (fejl) {
console.log ('Fejl ved afsendelse af besked:', fejl);
} else if (response.body.error) {
console.log ('Error:', response.body.error);
}
});
};
[/ Js]
Funktionen "sendMessage" har to parametre:
- recipientId
- besked
Modtageren er nødvendig, så meddelelsen kan adresseres til den rigtige bruger.
Meddelelsen er den faktiske tekst, der skal sendes i svaret.
3. Skub ændringerne til Heroku
Hvis du har gennemført ovenstående trin, skal din bot være i stand til at gentage den modtagne tekst. Men først skal du skubbe ændringerne til den ansøgning, der er hostet på Heroku. For at gøre dette skal du følge nedenstående trin:
1. Start terminal.
2. Skift mappe til din testbot bibliotek
cd testbot
3. Gør følgende trin:
- git add.
- Bemærk: Der er en "." I slutningen af "git add"
- git commit -m "Første commit"
- git push heroku master
4. Send nu en besked til din side, og boten vil ekko beskeden tilbage til dig.
Betingede svar aka gøre bot smartere
Vi kan bruge tekst matchende til at tillade vores Facebook messenger bot at reagere i henhold til visse specielle søgeord.
For at opnå dette skal vi tilføje en anden funktion. Jeg navngiver det "conditionalResponses", men du kan vælge hvilket navn du foretrækker.
1. Kodning af conditionalResponses Function
[Js]
funktion betingede svar (modtager, tekst) {
tekst = tekst || "";
var hvad = text.match (/ what / gi); // Kontroller, om tekststrengen indeholder ordet "hvad"; ignorere sagen
varGadget-Info.com = text.match (/ beebom / gi); // Kontroller, om tekststrengen indeholder ordet "beebom"; ignorere sagen
var hvem = text.match (/ hvem / gi); // Kontroller, om tekststrengen indeholder ordet "hvem"; ignorere sagen
var du = text.match (/ du / gi); // Kontroller, om tekststrengen indeholder ordet "dig"; ignorere sagen
// hvis tekst indeholder både "hvad" og "beebom", gør dette:
hvis (hvad! = null &&; Gadget-Info.com! = null) {
message = {
Tekst: "Beebom er et websted, der tilbyder tekniske ressourcer. Velkommen."
}
sendMessage (modtager, besked);
returnere sandt;
}
// hvis tekst indeholder både "hvem" og "dig", skal du gøre dette:
hvis (hvem! = null && you! = null) {
message = {
Tekst: "Jeg er blevet bedt om ikke at diskutere min identitet online."
}
sendMessage (modtager, besked);
returnere sandt;
}
// hvis intet matches, returner du false for at fortsætte udførelsen af den indre funktion.
returnere falsk;
};
[/ Js]
I linjer 4 til 7 har vi defineret variabler afhængigt af, at den modtagne streng matches med bestemte ord. Det bedste ved at bruge "text.match ()" er at det bruger Regular Expressions (normalt kaldet regex, læs mere her.). Det er godt for os, fordi det betyder, at så længe selv en del af et ord i den modtagne tekst stemmer overens med et af de ord, vi nævnte i text.match (), vil variablen ikke være null. Det betyder, at hvis den modtagne besked var "Hvad er Beebom?", "Var hvad" og "Var beebom" ikke vil være null, fordi ordet "Hvad er" indeholder ordet "hvad". Så vi er reddet fra at oprette ekstra udsagn for hver variation, hvor nogen kan sige "Hvad".
2. Redigering af meddelelseslytteren
Vi skal også redigere Message Listener vi kodede for at sikre, at den forsøger at matche den modtagne tekst med funktionen "conditionalResponses" også.
[Js]
app.post ('/ webhook', funktion (req, res) {
var events = req.body.entry [0] .messaging;
for (i = 0; i <events.length; i ++) {
var event = begivenheder [i];
hvis (event.message && event.message.text) {
// Prøv først at kontrollere, om modtaget besked kvalificerer til betinget respons.
hvis (! conditionalResponses (event.sender.id, event.message.text)) {
// hvis det ikke gør det, simpelthen ekko den modtagne besked tilbage til afsenderen.
sendMessage (event.sender.id, {text: "Echo:" + event.message.text});
}
}
}
res.sendStatus (200);
});
[/ Js]
Ændringerne i lytteren ser måske ikke meget drastisk ud, men deres virkninger er helt sikkert. Nu forsøger lytteren først at reagere med betingede svar, og hvis der ikke er nogen gyldig betingelse for den modtagne besked, gentager den simpelthen beskeden tilbage til brugeren.
3. Skub ændringerne til Heroku
Før du kan prøve de nye funktioner, skal du skubbe den opdaterede kode til den app, der er hostet på Heroku. Følg trinene herunder for at gøre dette:
1. Start terminal.
2. Skift mappe til din testbot bibliotek
cd testbot
3. Gør følgende trin:
- git add.
- Bemærk: Der er en "." I slutningen af "git add"
- git commit -m "Tilføjelse af betingede muligheder"
- git push heroku master
4. Send nu en besked til din side, og boten vil ekko beskeden tilbage til dig.
Endnu mere funktionalitet
Vores bot reagerer nu på et lille sæt kommandoer i fine, velstrukturerede svar. Men det er stadig ikke meget nyttigt. Lad os lave nogle flere ændringer til koden for at gøre vores bot til et mere " funktionelt " stykke software. Vi vil genopbygge en masse funktioner, og tilføje et par mere, så blive spændt.
1. Redigering af Message Listener
Vores besked lytter, på dette tidspunkt fungerer bare ok. Det er imidlertid ikke meget pænt formateret, og hvis vi skulle fortsætte med at øge de indlejrede, hvis udsagn for at tilføje ekstra " tilstandskontroller ", bliver det hurtigt grimt at se på, svært at forstå og langsommere ved henrettelsen. Det vil vi ikke, nu gør vi? Lad os lave nogle ændringer.
Bemærk: Der er en kodekode i meddelelseslytteren, der læser "res.sendStatus (200)", denne linje sender en status 200-kode til Facebook og fortæller, at funktionen er udført korrekt. Ifølge Facebook's dokumentation venter Facebook i højst 20 sekunder for at modtage en 200-status, før den beslutter at meddelelsen ikke gik igennem og stopper kørselens gennemførelse.
Vores nye meddelelseslytter ser sådan ud. Vi bruger kommandoen " res.sendStatus (200) " for at stoppe udførelsen af funktionen, så snart en tilstand er matchet og udført.
[Js]
app.post ('/ webhook', funktion (req, res) {
var events = req.body.entry [0] .messaging;
for (i = 0; i <events.length; i ++) {
var event = begivenheder [i];
hvis (event.message && event.message.text) {
// Første tjek besked tekst imod introResponse betingelser
hvis (introResponse (event.sender.id, event.message.text)) {
res.sendStatus (200);
}
// for manglende et bedre navn, kaldte jeg dette nye svar: p; tjek dette næste
ellers hvis (newResponse (event.sender.id, event.message.text)) {
res.sendStatus (200);
}
// ellers, gentag bare den originale besked
ellers {
// erstatte ekko med gyldig kommandoliste
sendMessage (event.sender.id, {text: "Echo:" + event.message.text});
}
}
}
res.sendStatus (200);
});
[/ Js]
2. Kodning af newResponse-funktionen
Vores beskedlytter kontrollerer nu også meddelelsesteksten mod et sæt betingelser i "newResponse", men vi skal først kode for newResponse-funktionen. Vi bruger denne funktion til at kontrollere, om brugeren har bedt om artikelforslag fra theGadget-Info.comwebsite, søg forespørgselsperioden på hjemmesiden og præsentér linket til brugeren. Endnu engang vil vi bruge regulære udtryk til at matche tekst med bestemte søgeord.
[Js]
funktion newResponse (recipientId, text) {
tekst = tekst || "";
var foreslå = text.match (/ suggest / gi);
var tilfældig = text.match (/ random / gi);
varartikel = text.match (/ article / gi);
var iphone = text.match (/ iphone / gi);
var android = text.match (/ android / gi);
var mac = text.match (/ mac / gi);
var browser = text.match (/ browser / gi);
var vpn = text.match (/ vpn / gi);
// Kontrollér, om brugeren beder om forslag til artiklen overhovedet
hvis (foreslå! = null && artikel! = null) {
var forespørgsel = "";
// Hvis der er forespørgsler om artikelforslag, skal du kontrollere det emne, brugeren leder efter
hvis (android! = null) {
forespørgsel = "Android";
} ellers hvis (mac! = null) {
forespørgsel = "Mac";
} ellers hvis (iphone! = null) {
forespørgsel = "iPhone";
} ellers hvis (browser! = null) {
forespørgsel = "Browser";
} ellers hvis (vpn! = null) {
forespørgsel = "VPN";
}
sendButtonMessage (recipientId, query);
returnere sandt
}
returnere falsk;
};
[/ Js]
Vi anvender en anden brugerdefineret funktion kaldet "sendButtonMessage" for at sende beskeden, hvis brugeren beder om artikelforslag. Vi vil oprette dette næste.
3. Kodning af sendButtonMessage-funktionen
Funktionen sendButtonMessage tager to parametre, et modtager-id og en forespørgsel. Modtager-id'et bruges til at identificere den bruger, til hvem beskeden skal sendes, og forespørgslen bruges til at identificere det emne, som brugeren ønsker artikelforslag til.
[Js]
funktion sendButtonMessage (modtager, forespørgsel) {
var messageData = {
modtager: {
id: recipientId
},
besked: {
vedhæftet fil: {
skriv: "skabelon"
nyttelast: {
template_type: "button",
tekst: "Dette er hvad jeg fandt for" + forespørgsel,
knapper: [{
type: "web_url",
url: "//www.beebom.com/?s="+query,
titel: "Beebom:" + forespørgsel
}]
}
}
}
};
callSendAPI (messageData);
}
[/ Js]
Endnu engang bruger vi en brugerdefineret funktion; denne gang for at sende den endelige meddelelse med artiklen links til brugeren. Funktionen er på mange måder ligner den "sendMessage" -funktion, vi kodede tidligere, men er mere generisk, på den måde det tager meddelelsesdataene, som passer os, fordi vores meddelelsesdata ændres med forespørgslen, som brugeren laver.
4. Kodning af callSendAPI-funktionen
Funktionen "callSendAPI" tager en enkelt parameter, "messageData" . Denne parameter indeholder hele meddelelsesdata, formateret korrekt i henhold til Facebook-reglerne, så messenger kan vise det korrekt til brugeren.
[Js]
funktion callSendAPI (messageData) {
anmodning({
uri: '//graph.facebook.com/v2.6/me/messages',
qs: {access_token: process.env.PAGE_ACCESS_TOKEN},
metode: 'POST',
json: messageData
}, funktion (fejl, respons, krop) {
hvis (! fejl && response.statusCode == 200) {
var recipientId = body.recipient_id;
var messageId = body.message_id;
console.log ("Sendt succesfuldt generisk besked med id% s til modtager% s",
messageId, recipientId);
} ellers {
console.error ("Kunne ikke sende besked.");
console.error (respons);
console.error (fejl);
}
});
}
[/ Js]
5. Skub ændringerne til Heroku
Vi er på det sidste skridt i retning af at gøre vores opgraderede bot live. Vi skal bare skubbe alle kodeændringer til Heroku. Processen er den samme som før, og er skitseret nedenfor:
1. Start terminal.
2. Skift bibliotek til testbot biblioteket.
cd testbot
3. Gør følgende:
- git add.
- Bemærk: Der er en "." I slutningen af den kommando.
- git commit -m "forbedring af tilstandskontrol og formatering"
- git push heroku master
4. Send nu en besked som "Foreslå en artikel på Android", eller "Beebom, foreslå mig en artikel om emnet Android"; og boten sender en pænt formateret besked med et link, som du kan trykke på for at åbne artiklerne i forbindelse med din forespørgsel.
Grave dybere
Nu hvor du ved, hvordan du kommer i gang med at udvikle Facebook messenger bots, skal du gennem Facebook-dokumentationen om, hvordan du udvikler Facebook messenger bots. Mens dokumentationen ikke er god for begyndere, er du ikke en nybegynder længere. Du bør tjekke den officielle dokumentation og forsøge at finde ud af, hvordan du gør din bot endnu smartere. Teaser: Du kan også sende meddelelser med billeder og knapper! Det er også muligt at bruge tjenester som Wit.ai og Api.ai til at kode din bot og derefter integrere den med Facebook, men i mine svage forsøg på at bruge disse tjenester virker Wit.ai ikke for godt, og Api.ai har en skarp læringskurve for begyndere.
Har du nogensinde udviklet en Facebook messenger bot? Hvis du har, hvordan gik du om at udvikle den, og hvad kan den gøre? Har du brugt tjenester som Wit.ai og Api.ai til at lave din bot? Hvis du ikke nogensinde har prøvet dine hænder på at kode en bot, skal du udvikle din egen Facebook messenger bot, gøre det smartere og bedre, og fortæl os om din oplevelse i kommentarerne nedenfor.
