Rumah >hujung hadapan web >tutorial js >Membina bot sembang Facebook dengan Node dan Heroku
Bina chatbot Facebook menggunakan Node.js dan Heroku, peer-reviewed oleh Joan Yin dan Camilo Reyes. Terima kasih kepada semua pengulas rakan sebaya untuk mendapatkan kandungan SitePoint dengan sebaik -baiknya!
CHATBOTS memberi manfaat bukan sahaja perusahaan dan pemilik aplikasi. Pengguna robot ini boleh menikmati pelbagai perkhidmatan, seperti:
Dalam artikel ini, kami akan meneroka cara membuat chatbot Facebook yang dapat berinteraksi dengan pengguna melalui Messenger bagi pihak halaman Facebook. Kami akan membina robot yang dapat memberikan pengguna butiran yang berbeza mengenai filem yang mereka tentukan.
Kemahiran dalam AI pasti dapat membantu, terutama ketika datang untuk membina robot kompleks, tetapi tidak perlu. Anda pasti boleh membina robot tanpa memahami pembelajaran mesin.
anda boleh membina dua jenis robot. Satu adalah berdasarkan satu set peraturan, dan yang lain menggunakan pembelajaran mesin. Yang pertama adalah terhad dari segi interaksi yang dapat disediakannya. Ia hanya boleh bertindak balas terhadap arahan tertentu. Ini adalah jenis robot yang akan kita bina.
Dengan robot pembelajaran mesin, anda boleh mendapatkan interaksi pengguna yang lebih baik. Pengguna boleh berinteraksi dengan robot lebih semulajadi seperti yang mereka lakukan dalam interaksi manusia, bukan hanya menggunakan arahan. Robot juga akan menjadi lebih bijak kerana ia belajar dari perbualan dengan orang. Kami akan menyelamatkan pembinaan robot jenis ini dalam artikel masa depan. Walau bagaimanapun, tiada pengetahuan pembelajaran mesin diperlukan. Mujurlah, terdapat perkhidmatan seperti wit.ai dan api.ai yang membolehkan pemaju mengintegrasikan pembelajaran mesin (terutamanya pemprosesan bahasa semulajadi - NLP) ke dalam aplikasi mereka.
anda boleh memuat turun kod untuk aplikasi demo yang lengkap dari sini.
Agar chatbot anda berkomunikasi dengan pengguna Facebook, kami perlu menyediakan pelayan untuk menerima, memproses dan menghantar mesej kembali. Pelayan akan menggunakan API Graf Facebook untuk ini. API graf adalah cara utama untuk masuk dan keluar dari data platform Facebook. Pelayan mesti mempunyai URL Endpoint yang boleh diakses oleh pelayan Facebook, jadi menggunakan aplikasi web pada mesin tempatan tidak berfungsi, anda mesti membawanya dalam talian. Di samping itu, bermula dengan versi 2.5 API Grafik, langganan baru ke perkhidmatan mesti menggunakan URL Panggilan HTTPS yang selamat. Dalam tutorial ini, kami menggunakan aplikasi ke Heroku kerana semua domain appname.herokuapp.com lalai telah diaktifkan. Kami akan menggunakan Node.js untuk membina aplikasi web.
Pertama, pastikan nod dipasang pada komputer anda. Anda boleh menyemak ini dengan menaip nod -v di terminal. Jika dipasang, ia akan mengeluarkan nombor versi. Kemudian pasang antara muka baris arahan Heroku (CLI). Kami akan menggunakannya kemudian untuk menolak aplikasi ke Heroku. Gunakan Heroku --version untuk mengesahkan bahawa CLI dipasang.
Buat direktori projek dan mulakan fail Package.json menggunakan arahan berikut.
<code>$ mkdir spbot $ cd spbot $ npm init</code>
Ikuti arahan untuk menetapkan keutamaan projek anda.
Selepas menjana fail Package.json, buka dan tambahkan harta Mula ke objek skrip. Ini membolehkan Heroku mengetahui perintah mana yang hendak dilaksanakan untuk memulakan permohonan. Semasa persediaan projek, saya mentakrifkan app.js sebagai titik masuk aplikasi, jadi saya menggunakan node app.js sebagai nilai permulaan. Tukar tetapan ini mengikut tetapan projek anda.
<code>{ "name": "spbot", "version": "1.0.0", "description": "SPBot Server", "main": "app.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "node app.js" }, "author": "Joyce Echessa", "license": "ISC" }</code>
Pasang pakej nod berikut.
<code>$ npm install express request body-parser mongoose --save</code>
Buat fail .gitignore dalam direktori root projek dan masukkan folder Node_Modules untuk mengelakkannya daripada dikemukakan.
<code>node_modules</code>
Dalam direktori root projek, buat fail bernama app.js (index.js jika nama lalai digunakan). Ubah suai seperti berikut:
<code class="language-javascript">var express = require("express"); var request = require("request"); var bodyParser = require("body-parser"); var app = express(); app.use(bodyParser.urlencoded({extended: false})); app.use(bodyParser.json()); app.listen((process.env.PORT || 5000)); // 服务器索引页面 app.get("/", function (req, res) { res.send("已部署!"); }); // Facebook Webhook // 用于验证 app.get("/webhook", function (req, res) { if (req.query["hub.verify_token"] === "this_is_my_token") { console.log("已验证 webhook"); res.status(200).send(req.query["hub.challenge"]); } else { console.error("验证失败。令牌不匹配。"); res.sendStatus(403); } });</code>
Pengendali GET pertama akan digunakan untuk ujian kami sendiri - untuk melihat apakah permohonan itu telah berjaya digunakan. Pengendali GET kedua adalah titik akhir Facebook akan digunakan untuk mengesahkan aplikasi. Kod harus mencari verifikasi_token dan bertindak balas dengan cabaran yang dihantar dalam permintaan pengesahan.
Anda boleh menampal token anda sendiri ke dalam kod. Jenis data ini paling baik disimpan dalam pembolehubah persekitaran, yang akan kami lakukan dengan segera selepas membuat projek di Heroku.
Agar platform Facebook untuk menyambung ke aplikasi backend kami, kami perlu membawanya secara dalam talian.
Buat repositori git dan serahkan projek menggunakan arahan berikut:
<code>$ git init $ git add . $ git commit -m "Initial commit"</code>
Jika anda belum melakukannya, sila daftar untuk akaun Heroku percuma.
Log masuk ke Heroku dari terminal anda dan buat aplikasi.
<code>$ heroku login $ heroku create $ git push heroku master $ heroku open</code>
Selepas menjalankan perintah terbuka Heroku, pautan untuk menjalankan aplikasi akan dibuka dalam penyemak imbas lalai anda. Jika semuanya berjalan lancar, anda akan melihat halaman dengan teks "Digunakan!".
Sebelum meneruskan, mari buat pembolehubah persekitaran di Heroku untuk menyelamatkan token pengesahan aplikasi.
Buka papan pemuka Heroku anda dan pilih aplikasi yang anda gunakan. Pergi ke tetapan aplikasi dan klik tunjukkan pembolehubah konfigurasi butang. Masukkan verifikasi_token sebagai kekunci , masukkan token anda sebagai nilai , dan kemudian klik untuk menambah .
Apabila pelayan sedang berjalan dan berjalan, kami kini akan membuat aplikasi Facebook dan halaman yang berkaitan. Anda boleh membuat halaman baru atau menggunakan halaman sedia ada.
Untuk membuat halaman Facebook, log masuk ke Facebook dan pergi ke halaman Buat. Pilih jenis halaman dari pilihan yang diberikan. Saya memilih hiburan .
Selepas mengklik
, halaman akan dibuat dan anda akan diminta untuk memberikan maklumat yang lebih terperinci mengenai aplikasi anda (deskripsi, laman web, gambar profil, penonton sasaran, dll.). Anda kini boleh melangkau langkah persediaan ini.
Untuk membuat aplikasi Facebook, pergi ke halaman aplikasi Tambah baru dan klik tetapan asas
di bawah.
Isi maklumat terperinci yang diperlukan. Pilih Aplikasi berorientasikan halaman
Buat ID App , papan pemuka aplikasi akan dibuka.
Dalam tetapan produk
di sebelah kanan, klik . Anda kemudian akan dibawa ke halaman Tetapan Messenger seperti yang ditunjukkan di bawah.
Di bahagian webhook, klik
Masukkan URL Panggil balik yang dikemas kini (URL Endpoint yang ditakrifkan dalam aplikasi backend, iaitu /webhook), dan masukkan token pengesahan (token yang digunakan dalam aplikasi backend, iaitu disimpan dalam proses. Nilai dalam Env. Verifikasi_token) dan pilih semua kotak semak. Ini menentukan peristiwa mana yang akan melanggan. Kami akan belajar tentang peranan peristiwa -peristiwa ini kemudian.
Selepas berjaya membolehkan WebHook, anda harus melihat diselesaikan di bahagian Webhook, serta senarai acara yang dilanggan. Jika anda menerima ralat, pastikan anda memasuki URL yang betul untuk titik akhir WebHook (akhir dengan /webhook) dan pastikan token yang digunakan di sini adalah sama seperti yang anda gunakan dalam aplikasi nod anda. Token Generation , pilih halaman anda dari menu drop-down. Selepas pengesahan, token akses halaman akan dijana untuk anda.
ke page_access_token dan ambil token yang dihasilkan sebagai nilai . Perhatikan bahawa token yang dihasilkan tidak disimpan dalam halaman semasa di mana ia dipaparkan di Facebook. Setiap kali anda mengakses halaman, medan Token Akses Halaman akan kosong, dan token baru akan dijana apabila anda memilih halaman Facebook anda dari menu drop-down halaman. Walau bagaimanapun, mana -mana token yang dibuat sebelum ini akan terus berfungsi. Oleh itu, pastikan anda menyalin token sebelum menutup halaman.
Agar webhook anda menerima acara pada halaman tertentu, anda mesti melanggan permohonan anda ke halaman tersebut. Dalam bahagian , pilih halaman yang ingin anda langgan.
Skrin Selamat Datang Untuk menetapkan teks ucapan, buka halaman anda dan pergi ke . dari panel kiri, dan buka
Operasi di atas menghantar permintaan ke API Grafik Facebook. Jika permintaan itu berjaya, butang Mula akan muncul pada skrin selamat datang perbualan baru. Pengguna mengklik butang ini dan mencetuskan Postback menerima panggilan balik. Bot anda kemudian boleh bertindak balas terhadap postback ini. Postback boleh dicetuskan oleh pelbagai jenis komponen -butang Postback, butang mula, menu berterusan, atau mesej berstruktur. Anda boleh menetapkan sebarang rentetan sebagai muatan. Di backend, kami akan menggunakan rentetan ini untuk mengenal pasti postback yang dihantar kerana mengklik butang Mula. Untuk menerima mesej postback, permohonan anda mesti melanggan postback pada webhook anda. Kami melakukan ini sebelum ini apabila menyiapkan webhook dengan memilih kotak semak Messaging_Postbacks. Jika butang Mula berjaya ditetapkan, anda akan melihat tindak balas berikut. ingat bahawa skrin selamat datang dan butang permulaan hanya dipaparkan dalam perbualan baru. Apabila pengekodan dan menguji bot, anda boleh memulakan perbualan baru dengan memadam perbualan semasa. untuk memproses mesej postback, tampal berikut ke dalam aplikasi nod anda. Apabila seseorang berinteraksi dengan bot anda atau menghantar mesej ke halaman anda, kemas kini dihantar melalui integrasi webhook anda. Untuk mendapatkan mesej, anda mesti mendengar panggilan siaran di webhook. Semua panggilan balik akan dihantar ke webhook ini. Di dalam pengendali pos di atas, kami melangkah ke atas penyertaan mesej yang dihantar ke permohonan. Kadang -kadang mesej dihantar bersama dalam kelompok, jadi entri mungkin mengandungi pelbagai objek. Kami kemudian melangkah melalui acara mesej untuk setiap entri dan periksa jenisnya. Berikut adalah mesej panggil balik yang berbeza yang boleh dihantar ke permohonan. Jika acara adalah postback, kami akan memanggil fungsi ProcessPostback (), di mana kami akan menyemak nilai muatan. Ingat bahawa kami menetapkan ucapan kepada muatan butang permulaan, jadi di sini kami mula -mula periksa jika acara mesej dihantar kerana mengklik butang. Jika ya, kami akan menggunakan API Profil Pengguna untuk mendapatkan nama pengguna dan menggunakannya untuk memperibadikan mesej yang akan dihantar kembali kepada mereka. Dari API, anda boleh mendapatkan nama mereka, nama belakang, gambar profil, lokasi, zon waktu, dan jantina. kemudian hantar mesej ke fungsi SendMessage (), yang menerbitkannya ke platform Messenger. Di Webhook Post Handler, kami mengembalikan 200 OK respons HTTP. kembali 200 secepat mungkin adalah sangat penting. Facebook akan menunggu 200 sebelum menghantar mesej seterusnya. Dalam bot berkapasiti besar, kelewatan 200 pulangan boleh menyebabkan kelewatan yang ketara untuk Facebook menyampaikan mesej ke webhook anda. Jika webhook anda mengembalikan ralat (iaitu negeri 2xx) atau tamat tempoh (iaitu, masa tindak balas melebihi 20 saat) dan terus berbuat demikian selama lebih dari 15 minit, anda akan menerima amaran amaran. Jika webhook terus gagal selama 8 jam, Facebook akan menghantar amaran kepada anda bahawa webhook sedang dilumpuhkan dan aplikasi anda akan berhenti berlangganan. Selepas menetapkan isu ini, anda mesti menambah semula webhook dan melanggan semula permohonan ke halaman tersebut. Kirim perubahan dan tolak mereka ke Heroku. Untuk menguji bot, anda boleh menggunakan pautan pendek messenger anda dari facebook.com, aplikasi mudah alih Facebook atau menggunakan pautan pendek messenger anda https://www.php.cn/link/1fd37ce80d495555555555555555555e0054d7384fe . Di Facebook dan Messenger, anda boleh mencari halaman dengan mencari nama halaman. lebih banyak dari menu drop-down untuk mengedit maklumat halaman .
kemudian tetapkan nama pengguna. https://www.php.cn/link/13f3d8f0b1d534d2ce3122263653c5594 Seperti yang ditunjukkan di bawah, anda dapat melihat teks ucapan yang kami tetapkan untuk skrin selamat datang dan butang Start .
Oleh kerana interaksi bolak -balik ini, robot perlu mengingati entri filem semasa pengguna. Facebook tidak menyimpan sesi terbuka dengan webhook anda, jadi sebarang data yang anda simpan dalam objek sesi akan hilang dalam permintaan seterusnya. Kami akan menyimpan data ini dalam pangkalan data sebaliknya -MonoDB secara khusus. Kami akan menggunakan MLAB Add-on pada Heroku. Mlab adalah pangkalan data-as-a-service untuk MongoDB. Pada Heroku, sementara anda boleh menggunakan pelan MLAB Sandbox percuma, anda perlu menyimpan kad kredit anda di Heroku untuk pengesahan. Jika anda tidak mahu memberikan butiran kad anda, anda boleh mendaftarkan akaun di laman web MLAB, di mana anda membuat lapisan pangkalan data kotak pasir percuma dan pautan ke pangkalan data tersebut dari kod anda (lebih lanjut pada kemudiannya). Untuk menggunakan add-ons pada Heroku, pergi ke papan pemuka aplikasi dan pilih sumber Sediakan pangkalan data melalui laman web MLAB nod tunggal dan pilih Sandbox dari seksyen standard seksyen.
Buat butang MongoDB Deployment Pilih tab Tambah pengguna pangkalan data Buat . Ini akan membuat set kelayakan baru yang boleh anda gunakan untuk membolehkan aplikasi anda mengakses pangkalan data.
Di bahagian atas halaman, cari dan salin pangkalan data URI - ia kelihatan seperti mongoDB: // : @dsxxxxxx.mlab.com: 55087/spbot. Masukkan nama dan kata laluan DBUSER yang baru anda buat. Pada Heroku, buat pembolehubah persekitaran bernama Mongodb_uri dan tampal URI pangkalan data sebagai nilainya. Kembali ke aplikasi nod, buat fail yang dinamakan filem.js dan simpannya dalam folder bernama model. Tampalkan berikut ke dalam fail: Model pangkalan data filem dibuat di atas. user_id akan menjadi ID pengguna yang diperoleh dari platform Messenger, sementara bidang lain akan diperolehi dari API filem. Kami hanya akan menyimpan filem terakhir yang dicari oleh pengguna, jadi pangkalan data hanya mempunyai satu rekod setiap pengguna. kita boleh menghilangkan medan user_id dan hanya menggunakan ID pengguna sebagai _id untuk setiap rekod yang dibuat. Ini akan berfungsi kerana ID pengguna unik ke halaman Facebook. Jika anda akan melakukan ini, anda harus tahu bahawa ID pengguna adalah halaman. Ini bermakna ID pengguna adalah unik untuk halaman yang diberikan, tetapi pengguna mungkin mempunyai ID yang berbeza untuk halaman yang berbeza. Anda hanya perlu tahu ini apabila bot anda menyajikan halaman yang berbeza (ya, satu bot boleh melayani beberapa halaman). Oleh itu, jika bot anda melayani beberapa halaman, mungkin gagal mengenal pasti pengguna dengan id penggunanya sahaja, dan medan _id menggunakan id pengguna kerana rekod juga akan gagal kerana ini mestilah unik, dan anda tidak akan dapat menjamin keunikan di seluruh halaman. Selepas pangkalan data dan model disediakan, kini kami dapat menyelesaikan chatbot. Kod ini akan diberikan dalam bahagian, tetapi jika anda ingin menampal keseluruhan kod ke dalam projek anda, berikut adalah pautan ke fail app.js. Mula -mula menyediakan sambungan pangkalan data. Mongoose sepatutnya dipasang dengan modul lain sebelum ini. Ubah suai pengendali pos webhook seperti yang ditunjukkan di bawah. Kami menambah cek untuk peristiwa mesej jenis dan lulus mereka ke fungsi ProcessMessage (). Di sini, kami mula -mula menyemak sama ada mesej itu dihantar melalui panggilan balik echo mesej. Panggilan balik ini berlaku apabila halaman anda menghantar mesej. Sebagai contoh, mesej pertama (ucapan) yang kami hantar kepada pengguna akan dihantar kembali ke webhook kami. Kami tidak mahu memproses mana -mana mesej kami sendiri, jadi kami menyemaknya. maka kita periksa sama ada mesej itu teks atau lampiran (imej, video, audio). Untuk yang terakhir, kami menghantar mesej ralat kepada pengguna. Untuk mesej teks, kami periksa sama ada input sepadan dengan kata kunci tertentu yang akan menunjukkan perincian yang pengguna ingin mempunyai filem. Pada ketika ini, pengguna telah menanyakan filem dan filem akan disimpan dalam pangkalan data. Fungsi getMoviedetail () menanyakan pangkalan data dan mengembalikan rekod tertentu. Jika pertanyaan pengguna tidak sepadan dengan mana -mana kata kunci yang ditetapkan, robot menganggap input digunakan untuk pertanyaan filem, jadi ia diserahkan kepada fungsi FindMovie (), yang memanggil API Pangkalan Data Filem Terbuka menggunakan input. Jika filem ditemui, simpan butirannya dengan ID pengguna. Jika rekod dengan ID pengguna telah dibuat sebelum ini, ia akan dikemas kini. Kami kemudian membuat mesej berstruktur dan menghantarnya kepada pengguna. Selain teks, platform Messenger membolehkan anda menghantar imej, video, audio, fail, dan mesej berstruktur. Mesej berstruktur adalah templat yang menyokong kes penggunaan yang berbeza. Templat butang membolehkan anda menghantar teks dan butang. Templat sejagat membolehkan anda menentukan imej, tajuk, sari kata, dan butang. Dalam permohonan kami, kami menggunakan templat sejagat. Ubah suai fungsi ProcessPostback () seperti yang ditunjukkan di bawah. di bahagian
Untuk menerima mesej dan acara lain yang dihantar oleh pengguna Messenger, aplikasi itu harus membolehkan integrasi webhook. Kami akan melakukan ini seterusnya. WebHook (dahulunya dikenali sebagai Kemas Kini Live ) membolehkan anda melanggan perubahan yang anda ingin menjejaki dan menerima kemas kini dalam masa nyata tanpa memanggil API. tetapkan webhook
Buat pembolehubah persekitaran lain pada Heroku dan tetapkan kekunci
Pengguna perkara pertama melihat apabila mereka memulakan perbualan baru dengan bot anda adalah skrin selamat datang. Skrin ini akan memaparkan nama, keterangan, gambar profil, dan foto penutup halaman anda. Anda boleh menyesuaikan skrin dengan menetapkan teks ucapan, yang akan digunakan dan bukannya penerangan halaman. Anda boleh menggunakannya untuk menyediakan mesej pengenalan untuk membolehkan pengguna mengetahui apa yang mereka dapat dari bot anda.
Secara lalai, untuk memulakan perbualan, pengguna akan menghantar mesej pertama ke bot anda. Walau bagaimanapun, anda boleh mengaktifkan butang Mula untuk membolehkan bot anda menghantar mesej awal. Butang akan menghantar acara ke pelayan anda, yang kemudian anda boleh bertindak balas.
Pilih di panel kanan untuk memaparkan ucapan utusan
Untuk mengaktifkan butang Mula, gantikan rentetan page_access_token dalam pernyataan berikut dengan token anda dan tampal arahan ke dalam terminal. <code>$ mkdir spbot
$ cd spbot
$ npm init</code>
<code>{
"name": "spbot",
"version": "1.0.0",
"description": "SPBot Server",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app.js"
},
"author": "Joyce Echessa",
"license": "ISC"
}</code>
<code>$ npm install express request body-parser mongoose --save</code>
untuk memulakan interaksi.
Selepas mengklik butang ini, anda harus melihat mesej yang dihantar dari pelayan.
Apabila pengguna memasuki nama filem, robot menggunakan API pangkalan data terbuka untuk mendapatkan butiran filem. Permintaan API yang akan kami gunakan hanya akan mendapat hasil pertandingan pertama, jadi filem yang dikembalikan mungkin tidak selalu menjadi apa yang pengguna inginkan. Oleh itu, robot akan pertama kali mengesahkan dengan pengguna sama ada ia telah memperoleh filem yang betul, dan selepas itu, pengguna boleh mendapatkan maklumat terperinci seperti plot, pelakon, penilaian IMDB, dan lain -lain filem. Mereka juga boleh memasukkan nama filem lain dan mendapatkan butiran mereka.
Jika anda menyemak pembolehubah persekitaran di Heroku, anda akan melihat pembolehubah dengan set MongoDB URI.
pelan
tetapan ke
baru untuk menyelesaikan proses.
Pada halaman berikut, pilih pangkalan data yang anda buat dari jadual yang dipaparkan. Halaman dibuka dengan arahan mengenai cara mengakses pangkalan data. pengguna
Tentukan kelas model
<code>$ mkdir spbot
$ cd spbot
$ npm init</code>
Mengintegrasikan segala -galanya bersama -sama
<code>{
"name": "spbot",
"version": "1.0.0",
"description": "SPBot Server",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app.js"
},
"author": "Joyce Echessa",
"license": "ISC"
}</code>
<code>$ npm install express request body-parser mongoose --save</code>
<code>node_modules</code>
<code class="language-javascript">var express = require("express");
var request = require("request");
var bodyParser = require("body-parser");
var app = express();
app.use(bodyParser.urlencoded({extended: false}));
app.use(bodyParser.json());
app.listen((process.env.PORT || 5000));
// 服务器索引页面
app.get("/", function (req, res) {
res.send("已部署!");
});
// Facebook Webhook
// 用于验证
app.get("/webhook", function (req, res) {
if (req.query["hub.verify_token"] === "this_is_my_token") {
console.log("已验证 webhook");
res.status(200).send(req.query["hub.challenge"]);
} else {
console.error("验证失败。令牌不匹配。");
res.sendStatus(403);
}
});</code>
<code>$ git init
$ git add .
$ git commit -m "Initial commit"</code>
<code>$ mkdir spbot
$ cd spbot
$ npm init</code>
Atas ialah kandungan terperinci Membina bot sembang Facebook dengan Node dan Heroku. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!