Recomandat, 2024

Alegerea Editorului

Cum de a crea un Facebook Messenger Bot (Ghid)

Funcția Facebook "messenger boots" nu este nimic nou, și există deja mulți boturi minunați. Cu toate acestea, resursele cu privire la exact cum să vă construiți propriul bot sunt rare și lipsesc în explicații pentru persoanele care sunt noi în API-ul Facebook Graph. Messenger bots acum necesită, de asemenea, să utilizați o adresă URL de back-up de back-up securizat SSL securizat (mai târziu, mai târziu), iar configurarea SSL nu este pentru toată lumea și costă, de asemenea, bani.

În acest articol, vă voi trece prin întregul proces de creare a unui simplu bot de mesagerie din Facebook, deoarece documentația proprie a Facebook este destul de prost explicată. Vom configura o aplicație cloud care folosește protocolul https, codul bot în Node.js (care este un limbaj de javascript, de pe server), folosiți git pentru a împinge codul în aplicația cloud și pentru a-l testa pe Facebook Messenger.

Setup Bot

Veți avea nevoie de Nod instalat pe laptop. Dacă nu, accesați site-ul Nod pentru al descărca și instala.

După ce ați terminat, puteți continua configurarea pentru bot. Urmați pașii de mai jos:

1. Lansați terminalul.

2. Aveți nevoie de un director separat pentru păstrarea codului.

  • Creați un nou director
    mkdir testbot
  • Schimbați directorul de lucru în directorul pe care tocmai l-ați creat
    cd testbot

3. Apoi, inițializați aplicația Nod.
npm init

  • Vi se va cere să introduceți informații despre aplicația dvs., trebuie doar să utilizați setările implicite apăsând Enter pentru tot.

4. Instalați pachetele
npm install express body-parser request --save

  • Comanda va rula și va da câteva avertismente; ignoră-i.

5. În Finder, deschideți directorul " testbot " pe care l-ați creat și găsiți fișierul numit " package.json "; deschideți acest lucru într-un editor ca textul sublim.

6. În acest fișier, trebuie să adăugăm o linie
"start": "node index.js"

  • Nu uitați să adăugați un ", " la sfârșitul liniei anterioare.

7. Apoi, creați un fișier nou în Sublime Text și introduceți în el următorul cod:

[Js]

var express = necesită ("expres");
var bodyParser = necesită ('body-parser');
var request = solicită ('request');
var app = expres ();

app.use (bodyParser.urlencoded ({extended: false}});
app.use (bodyParser.json ());
app.listen ((process.env.PORT || 3000));
app.get ('/', funcția (req, res) {
res.send ('Acesta este serverul TestBot');
});
app.get ('/ webhook', funcție (req, res) {
dacă (req.query ['hub.verify_token'] === 'testbot_verify_token') {
res.send (req.query [ 'hub.challenge']);
} altceva {
res.send ("Verificați tokenul nevalid");
}
});

[/ Js]

Salvați acest fișier ca index.js

Notă: În rândul 13, valoarea "hub.verify_token" este setată ca " testbot_verify_token", rețineți această valoare, deoarece va fi utilizată atunci când creați webhook pe Facebook.

Creați un depozit Git

Acum, când am pregătit operația de repornire a botului nostru, trebuie să împingem codul lui Heroku. Pentru aceasta, trebuie să creați un depozit git în directorul nostru.

Notă: "git" este un sistem de control al versiunilor pentru fișiere și cod de software. Puteți citi mai multe despre aceasta pe Wikipedia.

Crearea unui depozit git este ușoară și durează doar câteva comenzi Terminal.

Notă: asigurați-vă că sunteți în interiorul directorului " testbot " din Terminal. Puteți face acest lucru tastând comanda pwd în Terminal.

Urmați acești pași pentru a crea un depozit git:

1. git init

2. git add .

3. git commit -m "Register Facebook Webhook"

Setup Heroku

Înainte de a intra chiar în paginile dezvoltatorului Facebook, avem nevoie de o adresă URL de apel invers la care să discute Facebook. Această adresă URL trebuie să utilizeze protocolul https, ceea ce înseamnă că trebuie să instalați un certificat SSL pe site-ul nostru; dar, acesta este un ghid de incepatori pentru bot messenger Facebook, asa ca sa nu complicam lucrurile. Vom folosi Heroku pentru a ne folosi codul. Heroku vă oferă https URL-uri pentru aplicațiile dvs. și are un plan gratuit care satisface cerințele noastre (foarte de bază).

Du-te la site-ul Heroku și înregistrați-vă.

Notă: În câmpul "Alegeți limbajul de dezvoltare primară", utilizați "Eu folosesc o altă limbă".

Odată ce ați terminat cu asta, instalați toolbar-ul Heroku pentru sistemul dvs. de operare (Mac, pentru mine) și instalați-l. Acest lucru vă va oferi acces la Heroku pe Terminalul dvs. (sau pe promptul de comandă, pe Windows).

Apoi, vom crea o aplicație pe Heroku, care va conține întregul cod pentru botul nostru. Urmați pașii de mai jos:

1. Lansați terminalul

2. Introduceți heroku login

  • Vi se va cere să introduceți e-mailul și parola.
  • Introduceți e-mailul, apăsați Enter; apoi introduceți parola, apăsați Enter.
  • Veți fi conectat (ă) la heroku

3. Type heroku create

  • Aceasta va crea o aplicație pe Heroku și vă va furniza un hyperlink. Rețineți că linkul utilizează protocolul https. Ușor, nu?

4. Acum puteți împinge codul aplicației dvs. la Heroku
git push heroku master

5. Odată ce acest lucru este făcut, aplicația este practic live și puteți vizita link-ul din browserul dvs. pentru a verifica dacă totul funcționează bine. Ar trebui să deschidă o pagină web spunând " Acesta este serverul TestBot ".

Configurarea Facebook

Este timpul să vă conectați botul la Facebook! Va trebui să creați o pagină Facebook nouă sau să utilizați o pagină existentă pe care o dețineți. Vă voi arăta cum să procedați prin crearea unei noi pagini Facebook.

1. Mergeți la Facebook și creați o pagină nouă.

  • Puteți crea o pagină în categoria dorită. Opresc pentru companie / organizație, fără nici un motiv special.

2. Următorii pași pe care Facebook le prezintă sunt opțional și pot fi săriți.

3. Apoi, mergeți pe site-ul Web al dezvoltatorilor Facebook.

  • În partea dreaptă sus, plasați mouse-ul pe " Aplicațiile mele " și apoi faceți clic pe " Adăugați o aplicație nouă " din meniul derulant.

  • Faceți clic pe " configurare de bază " atunci când Facebook vă solicită să alegeți o platformă.

4. Completați detaliile pentru numele aplicației și adresa de e-mail de contact.

  • Selectați " Aplicații pentru pagini " din categorie.
  • Dați clic pe " Creați ID de aplicație ".

5. Veți fi duși la tabloul de bord pentru aplicația dvs. În bara laterală, navigați la " + Adăugați produse " și selectați " Messenger " făcând clic pe butonul " Începeți ".

6. Selectați " Setup Webhooks ".

7. Completați câmpurile obligatorii, înlocuind URL-ul "Callback URL" cu adresa URL a aplicației Heroku, Verificați Token cu tokenul utilizat în fișierul index.js și selectați următoarele câmpuri de abonare:

  • message_deliveries
  • mesaje
  • message_optins
  • messaging_postbacks

Notă: Asigurați-vă că adăugați " / webhook " la adresa URL de inversare, astfel încât index.js să execute funcția necesară atunci când Facebook încearcă să pingă adresa URL, poate verifica "Verificați token".

8. Faceți clic pe " Confirmați și salvați ".

9. În secțiunea " Generarea de jetoane ", faceți clic pe " Selectați o pagină " și selectați pagina pe care ați creat-o mai devreme.

Aceasta va genera un " Token Acces la Pagină ", salvează-l undeva; veți avea nevoie mai târziu.

10. Apoi, va trebui să efectuați o interogare POST în aplicația dvs., utilizând Jetonul de acces pagină generat în ultima etapă. Acest lucru se poate face cu ușurință în Terminal. Doar rulați următoarea comandă, înlocuind PAGE_ACCESS_TOKEN cu tokenul de acces pe pagină pe care l-ați generat .

curl -X POST "//graph.facebook.com/v2.6/me/subscribed_apps?access_token=PAGE_ACCESS_TOKEN"

Ar trebui să primiți un răspuns "de succes " în Terminal.

Mai multe setări Heroku

Da, încă nu am terminat. Nici pe departe.

1. Mergeți la site-ul web Herody și conectați-vă cu ID-ul dvs. de e-mail.

2. Găsiți aplicația în "tabloul de bord" și dați clic pe ea.

3. Navigați la fila Setări.

4. Faceți clic pe " Reveal Config Vars "

5. Adăugați PAGE_ACCESS_TOKEN ca " config var " și faceți clic pe " Adăugați ".

Codarea realei Bot

Acum, când am terminat de lucru, putem să ne concentrăm asupra a ceea ce contează cu adevărat: să facem botul să răspundă la mesaje. Pentru a începe, vom proiecta un bot care doar ecou mesajele pe care le primește. După cum se dovedește, această sarcină simplă necesită un cod considerabil de funcționare.

1. Codificarea mesajului de ascultare a mesajelor

Înainte ca botul să poată repeta mesajul, trebuie să fie capabil să asculte mesajele. Să facem asta mai întâi.

În fișierul index.js, adăugați următorul cod:

[Js]

app.post ('/ webhook', funcție (req, res) {
var evenimente = req.body.entry [0] .messaging;
pentru (i = 0; i <events.length; i ++) {
var event = evenimente [i];
if (event.message && event.message.text) {
sendMessage (event.sender.id, {text: "Echo:" + event.message.text});
}
}
res.sendStatus (200);
});

[/ Js]

Ce face această funcție, verifică mesajele primite și apoi verifică dacă există mesaj în mesaj. Dacă găsește text în mesajul primit, el apelează funcția sendMessage (afișată mai târziu), care transmite ID-ul expeditorului și textul pentru a trimite înapoi. Este important să înțelegeți următoarele valori și ce înseamnă acestea:

  • event.message.text este textul primit în mesaj. De exemplu, dacă cineva trimite mesajul "Hello" botului nostru, valoarea event.message.text va fi "Hello".
  • event.sender.id este idul persoanei care a trimis mesajul botului. Acest lucru este necesar pentru ca botul să știe în care să răspundă răspunsul.

2. Codificarea funcției sendMessage

Permite codul funcției "sendMessage", acum.

[Js]

funcția sendMessage (recipientId, mesaj) {
cerere({
url: '//graph.facebook.com/v2.6/me/messages',
qs: {access_token: process.env.PAGE_ACCESS_TOKEN};
metoda: "POST",
json: {
destinatar: {id: recipientId},
mesaj: mesaj,
}
}, funcție (eroare, răspuns, corp) {
dacă (eroare) {
console.log ("Eroare la trimiterea mesajului:", eroare);
} altfel dacă (answer.body.error) {
console.log ("Eroare:", răspuns.body.error);
}
});
};

[/ Js]

Funcția "sendMessage" are doi parametri:

  • recipientId
  • mesaj

Receptorul ID este necesar pentru ca mesajul să poată fi adresat utilizatorului corect.

Mesajul este textul real care trebuie trimis în răspuns.

3. Împingeți schimbările la Heroku

Dacă ați finalizat pașii de mai sus, botul dvs. ar trebui să poată reda înapoi textul primit. Dar, mai întâi, trebuie să împingeți modificările la aplicația găzduită pe Heroku. Pentru aceasta, urmați pașii de mai jos:

1. Lansați terminalul.

2. Schimbați directorul în directorul testbot
cd testbot

3. Urmați pașii următori:

  • adăugați git.
  • Notă: există un "." La sfârșitul "git add"
  • git commit -m "Primul comite"
  • git push master heroku

4. Acum trimiteți un mesaj la pagina dvs., iar botul va trimite mesajul înapoi la dvs.

Răspunsuri Condiționale aka Efectuarea Bot mai inteligent

Putem folosi potrivirea textului pentru a permite botului nostru de mesagerie Facebook să răspundă în funcție de anumite cuvinte cheie speciale.

Pentru a realiza acest lucru, trebuie să adăugăm o altă funcție. Îl numesc "condiționatăResponses", dar poți alege orice nume preferi.

1. Codarea funcției de condițieResponses

[Js]

funcția conditionalResponses (recipientId, text) {
text = text || "";

var ce = text.match (/ ce / gi); // verificați dacă șirul de text conține cuvântul "ce"; ignora cazul
varGadget-Info.com = text.match (/ beebom / gi); // verificați dacă șirul de text conține cuvântul "beebom"; ignora cazul
var care = text.match (/ cine / gi); // verificați dacă șirul de text conține cuvântul "cine"; ignora cazul
var you = text.match (/ you / gi); // verificați dacă șirul de text conține cuvântul "voi"; ignora cazul

// dacă textul conține atât "ce" și "beebom", procedați astfel:

dacă (ce! = null &&; Gadget-Info.com! = null) {
message = {
text: "Beebom este un site web care oferă resurse tehnologice.
}
sendMessage (recipientId, mesaj);
return true;
}

// dacă textul conține atât "cine", cât și "tu", faceți acest lucru:
dacă (care! = null && you! = null) {
message = {
text: "Am fost rugat să nu discut identitatea mea online."
}
sendMessage (recipientId, mesaj);
return true;
}

// dacă nu se potrivește nimic, întoarceți falsul pentru a continua executarea funcției interioare.
return false;
};

[/ Js]

În liniile 4 până la 7, am definit variabile în funcție de potrivirea șirului primit față de anumite cuvinte. Cea mai bună parte despre utilizarea "text.match ()" este că folosește expresii regulate (de obicei denumite regex, citiți mai multe aici). Este bine pentru noi, pentru că asta înseamnă că atâta timp cât o parte a unui cuvânt din textul primit se potrivește cu oricare dintre cuvintele pe care le-am menționat în text.match (), variabila nu va fi nulă. Aceasta înseamnă că, dacă mesajul primit a fost "Ce este Beebom?", "Var what" și "var beebom" nu vor fi nul, deoarece cuvântul "Ce este" conține cuvântul "ce". Deci suntem salvați de la crearea unor afirmații suplimentare pentru fiecare variantă în care cineva ar putea spune "Ce".

2. Editarea Message Listener

De asemenea, trebuie să editați Message Listener pe care am codificat-o pentru a ne asigura că încearcă să se potrivească cu textul primit cu funcția "conditionalResponses".

[Js]

app.post ('/ webhook', funcție (req, res) {
var evenimente = req.body.entry [0] .messaging;
pentru (i = 0; i <events.length; i ++) {
var event = evenimente [i];
if (event.message && event.message.text) {

// încercați mai întâi să verificați dacă mesajul primit primește un răspuns condiționat.
if (conditionalResponses (event.sender.id, event.message.text)) {

// dacă nu, trimiteți mesajul primit către expeditor.
sendMessage (event.sender.id, {text: "Echo:" + event.message.text});
}
}
}
res.sendStatus (200);
});

[/ Js]

Schimbările în ascultător ar putea să nu pară foarte drastice, dar efectele lor sunt sigur. Acum, ascultătorul încearcă mai întâi să răspundă cu răspunsuri condiționate, iar dacă nu există o condiție valabilă pentru mesajul primit, acesta doar trimite ecoul mesajului către utilizator.

3. Împingeți schimbările la Heroku

Înainte de a putea încerca noile caracteristici, va trebui să împingeți codul actualizat în aplicația găzduită pe Heroku. Urmați pașii de mai jos pentru a face acest lucru:

1. Lansați terminalul.

2. Schimbați directorul în directorul testbot
cd testbot

3. Urmați pașii următori:

  • adăugați git.
  • Notă: există un "." La sfârșitul "git add"
  • git commit -m "Adăugarea de capabilități condiționale"
  • git push master heroku

4. Acum trimiteți un mesaj la pagina dvs., iar botul va trimite mesajul înapoi la dvs.

Mai multă funcționalitate

Băutul nostru răspunde acum la un mic set de comenzi în răspunsuri bune, bine structurate. Dar nu este încă foarte util. Să facem mai multe modificări în cod pentru a face botul nostru o bucată de software mai " funcțională ". Vom revizui o mulțime de funcții și vom adăuga un cuplu mai mult, deci vă puteți bucura.

1. Editarea Message Listener

Mesajul ascultătorului nostru, în acest stadiu, funcționează doar bine. Cu toate acestea, nu este foarte frumos formatat și dacă am fi continua să creștem declarațiile im dacă am adăuga extra " controale condiționale ", va deveni rapid urât să te uiți, greu de înțeles și mai lent la execuție. Nu vrem asta acum, nu-i așa? Să facem niște schimbări.

Notă: Există o linie de cod în ascultătorul mesajului care citește "res.sendStatus (200)", această linie trimite un cod de stare 200 pe Facebook, spunându-i că funcția a fost executată cu succes. Conform documentației Facebook, Facebook așteaptă un maxim de 20 de secunde pentru a primi un statut de 200, înainte ca acesta să decidă că mesajul nu a trecut și nu mai execută codul.

Noul nostru ascultător de mesaje arată așa. Utilizăm comanda " res.sendStatus (200) " pentru a opri executarea funcției imediat ce o condiție este potrivită și executată.

[Js]

app.post ('/ webhook', funcție (req, res) {
var evenimente = req.body.entry [0] .messaging;
pentru (i = 0; i <events.length; i ++) {
var event = evenimente [i];
if (event.message && event.message.text) {

// verificați mai întâi textul mesajului față de condițiile introResponse
dacă (introResponse (event.sender.id, event.message.text)) {
res.sendStatus (200);
}

// pentru lipsa unui nume mai bun, am numit acest nouResponse: p; verificați acest lucru în continuare
altfel dacă (newResponse (event.sender.id, event.message.text)) {
res.sendStatus (200);
}

// altceva, trimiteți doar mesajul inițial
altfel {
// înlocuiți ecoul cu lista de comenzi valide
sendMessage (event.sender.id, {text: "Echo:" + event.message.text});
}
}
}
res.sendStatus (200);
});

[/ Js]

2. Codarea funcției newResponse

Mesajul ascultătorului nostru verifică acum mesajul mesajului față de un set de condiții din "newResponse", dar mai întâi trebuie să codificăm funcția newResponse. Vom folosi această funcție pentru a verifica dacă utilizatorul a cerut sugestii de articol de pe site-ul web Gadget-Info.com, căuta termenul de interogare de pe site și prezintă link-ul utilizatorului. Încă o dată, vom folosi expresii regulate pentru a potrivi textul cu anumite cuvinte cheie.

[Js]

funcția newResponse (recipientId, text) {
text = text || "";
var sugerează = text.match (/ suggest / gi);
var random = text.match (/ aleatoare / gi);
articolul var = text.match (/ articolul / gi);
var iphone = text.match (/ iphone / gi);
var șiroid = text.match (/ android / gi);
var mac = text.match (/ mac / gi);
var browser = text.match (/ browser / gi);
var vpn = text.match (/ vpn / gi);

// verificați dacă utilizatorul solicită sugestii despre articole
dacă (sugerăm! = null && articolul! = null) {
var interogare = "";
// dacă se pun întrebări despre articole, verificați subiectul pe care îl caută utilizatorul
dacă (android! = null) {
interogare = "Android";
} altfel dacă (mac! = null) {
interogare = "Mac";
} altfel dacă (iphone! = null) {
interogare = "iPhone";
} altfel dacă (browser! = null) {
interogare = "Browser";
} altfel dacă (vpn! = null) {
interogare = "VPN";
}
sendButtonMessage (recipientId, interogare);
retur adevărat
}
return false;
};

[/ Js]

Folosim o altă funcție personalizată numită "sendButtonMessage" pentru a trimite mesajul în cazul în care utilizatorul solicită sugestii de articol. Vom crea acest lucru în continuare.

3. Codarea funcției sendButtonMessage

Funcția sendButtonMessage necesită doi parametri, un ID destinatar și o interogare. ID-ul destinatarului este folosit pentru a identifica utilizatorul căruia trebuie trimis mesajul, iar interogarea este utilizată pentru a identifica subiectul pe care utilizatorul dorește sugestii de articol.

[Js]

funcția sendButtonMessage (recipientId, interogare) {
var messageData = {
destinatar: {
id: recipientId
},
mesaj: {
atașament: {
tip: "șablon",
sarcină utilă: {
template_type: "buton",
text: "Aceasta este ceea ce am găsit pentru" + interogare,
butoane:[{
tip: "web_url",
url: "//www.beebom.com/?s="+query,
titlu: "Beebom:" + interogare
}]
}
}
}
};

callSendAPI (messageData);
}

[/ Js]

Încă o dată, folosim o funcție personalizată; de data aceasta pentru a trimite utilizatorului final mesajul final, cu link-urile articolului. Funcția este, în multe feluri, similară cu funcția "sendMessage" pe care am codificat-o mai devreme, dar este mai generică în modul în care este nevoie de datele mesajului, ceea ce ni se potrivește, deoarece datele mesajului se modifică odată cu interogarea efectuată de utilizator.

4. Codarea funcției callSendAPI

Funcția "callSendAPI" are un singur parametru, "messageData" . Acest parametru conține toate datele mesajului, formatate corect conform regulilor Facebook, astfel încât mesagerul să le poată afișa în mod corespunzător utilizatorului.

[Js]

funcția callSendAPI (messageData) {
cerere({
uri: '//graph.facebook.com/v2.6/me/messages',
qs: {access_token: process.env.PAGE_ACCESS_TOKEN};
metoda: "POST",
json: messageData

}, funcție (eroare, răspuns, corp) {
dacă (! error && response.statusCode == 200) {
var recipientId = body.recipient_id;
var mesajId = body.message_id;

console.log ("S-a trimis mesajul generic cu id% s la destinatar% s",
messageId, recipientId);
} altceva {
console.error ("Nu se poate trimite mesajul");
console.error (răspuns);
console.error (eroare);
}
});
}

[/ Js]

5. Împingeți modificările la Heroku

Suntem la ultimul pas spre a face live botul nostru modernizat. Trebuie doar să împingem toate schimbările de cod la Heroku. Procesul este același ca înainte și este prezentat mai jos:

1. Lansați terminalul.

2. Schimbați directorul în directorul testbot .
cd testbot

3. Procedați după cum urmează:

  • adăugați git.
  • Notă: Există un "." La sfârșitul acestei comenzi.
  • git commit -m "îmbunătățirea verificării condițiilor și formatării"
  • git push master heroku

4. Acum trimiteți un mesaj precum "Sugerați un articol pe Android" sau "Beebom, sugerați-mi orice articol pe tema Android"; iar botul va trimite un mesaj frumos formatat cu un link pe care îl puteți atinge pentru a deschide articolele legate de interogarea dvs.

Sapă mai adânc

Acum că știți cum să începeți să dezvoltați roboții Facebook Messenger, treceți prin documentația Facebook despre cum să dezvoltați roboții Facebook Messenger. În timp ce documentația nu este bună pentru începători, nu mai sunteți începător. Ar trebui să verificați documentația oficială și să încercați să vă dați seama cum să vă faceți botul chiar mai inteligent. Teaser: Puteți trimite mesaje și cu imagini și butoane, de asemenea! De asemenea, este posibil să utilizați servicii precum Wit.ai și Api.ai pentru a codifica botul dvs. și apoi să-l integrați în Facebook, dar în încercările mele slabe de a utiliza aceste servicii, Wit.ai nu funcționează prea bine, iar Api.ai are o curbă ascuțită de învățare pentru începători.

Ai dezvoltat vreodată un bot de messenger Facebook? Dacă aveți, cum ați procedat la dezvoltarea acesteia și ce poate face? Ați folosit servicii precum Wit.ai și Api.ai pentru a vă crea botul? Dacă nu ați încercat vreodată mâinile cu privire la codarea unui bot, mergeți și dezvoltați propriul bot de mesagerie Facebook, faceți-l mai inteligent și mai bine și spuneți-ne despre experiența dvs. în comentariile de mai jos.

Top