Membangun Chatbot WhatsApp yang Didukung AI: Panduan Langkah demi Langkah

Diterbitkan: 2024-03-22
AI/ML 9 menit 4
22 Maret 2024

Ringkasan:

Pelajari cara membuat chatbot WhatsApp yang didukung AI langkah demi langkah, memanfaatkan kemampuan Node.js dan OpenAI. Mulai dari menyiapkan akun bisnis Meta hingga mengintegrasikan API WhatsApp dan OpenAI, panduan ini memberdayakan bisnis untuk menyederhanakan interaksi pelanggan dan membuka kemungkinan baru dalam komunikasi otomatis.

Di era digital saat ini, memanfaatkan kekuatan kecerdasan buatan (AI) untuk meningkatkan interaksi pelanggan adalah hal yang sangat penting bagi bisnis yang berupaya untuk tetap menjadi yang terdepan di pasar. WhatsApp, sebagai salah satu platform perpesanan yang paling banyak digunakan secara global, menghadirkan peluang besar bagi bisnis untuk berinteraksi dengan audiens mereka secara efektif. Masuki dunia chatbot WhatsApp yang didukung AI. Asisten virtual ini merevolusi layanan pelanggan, memberikan dukungan sepanjang waktu, dan menyederhanakan proses komunikasi.

Baik Anda adalah perusahaan rintisan yang sedang berkembang atau perusahaan yang sudah mapan, langkah-langkah pengembangan dapat menjadi lebih sederhana dengan pendekatan yang tepat. Dalam panduan komprehensif ini, kami akan mengeksplorasi prinsip dasar, prosedur langkah demi langkah, dan pertimbangan penting yang diperlukan untuk mengintegrasikan WhatsApp Business API dengan aplikasi Node.js Anda. Memanfaatkan kekuatan kemampuan pemrosesan bahasa alami OpenAI, kami akan menciptakan pengalaman pengguna yang lancar dan sesuai dengan audiens Anda.

Mulai dari menyiapkan akun WhatsApp Business hingga mengintegrasikan API OpenAI dengan kode Node.js Anda, ikuti kami saat kami menjelaskan prosesnya dan memberdayakan Anda untuk membangun solusi berbasis AI Anda sendiri. Perjalanan transformatif menuju ranah agen percakapan berbasis AI bukanlah perjalanan yang harus Anda lakukan sendirian. Perusahaan Pengembangan AI Chatbot dapat menjadi mitra tepercaya Anda, memberikan wawasan dan keahlian yang sangat berharga. Mari kita mulai ekspedisi menarik ini bersama-sama.

Langkah 1: Menyiapkan Akun dan Aplikasi Bisnis Meta (Facebook).

  1. Pertama buat akun bisnis Meta, (klik di sini).

Isi detailnya dan klik Kirim.

2. Buat Aplikasi Meta (Facebook) baru (klik di sini).

  • (Masuk) ke Akun Pengembang Meta (Facebook) Anda.

Setelah login, klik "Aplikasi Saya"

klik pada aplikasi saya

3. Sekarang klik “buat aplikasi”

4. Pilih “Lainnya” dan klik “berikutnya”.

5. Pilih Jenis Aplikasi: “Bisnis” dan klik “Berikutnya”.

6. Berikan detail aplikasi dan klik “Buat Aplikasi”

Langkah 2: Menyiapkan Aplikasi Meta (Facebook) untuk Integrasi WhatsApp

1. Tambahkan WhatsApp ke Aplikasi Meta (Facebook) Anda.

  • Di “Dasbor Pengembang”, pilih aplikasi Anda.
  • Temukan “Tambahkan produk ke aplikasi Anda” di tab dasbor aplikasi Anda.
  • Pilih "WhatsApp" untuk pengaturan.
  • Pilih Akun Bisnis Meta (Facebook) Anda
  • Navigasi ke Pengaturan aplikasi > Dasar dari sidebar
  • Simpan perubahan.
  • Setel Mode Aplikasi ke Hidup

Langkah 3: Hasilkan Token WhatsApp

Untuk mendapatkan Token Akses WhatsApp permanen, ikuti 1 hingga 3 langkah:

1. Buat “Pengguna Sistem”:

  • Kunjungi Meta Business Suite.
  • Temukan akun bisnis Anda di menu tarik-turun kiri atas dan klik ikon Pengaturan (roda gigi).
  • Klik Pengaturan Bisnis.
  • Buka Pengguna > Pengguna sistem.
  • Tambahkan pengguna sistem Admin.

2. Tambahkan Aset.

  • Setelah membuat pengguna sistem, klik Tambah Aset.
  • Navigasikan ke Aplikasi > “Nama aplikasi Anda”.
  • Pilih aplikasi Anda dan berikan kontrol penuh untuk mengelola aplikasi.

3. Hasilkan Token Akses Pengguna Sistem.

  • Klik tombol Hasilkan Token Baru pada pengguna sistem.

Pilih aplikasi yang akan menggunakan token dan atur masa berlaku token menjadi tidak pernah.

  • Pilih izin “whatsapp_business_messaging” dan “whatsapp_business_management”.
  • Hasilkan tokennya.
  • Salin token akses dan simpan dengan aman.

4. Tambahkan Nomor Bisnis baru untuk WhatsApp

  • Anda dapat menggunakan nomor bisnis Anda sendiri atau menggunakan nomor tes yang disediakan untuk chatbot WhatsApp Anda.
  • Di Dasbor Pengembang WhatsApp, navigasikan ke WhatsApp > Pengaturan API dari sidebar.
  • Lanjutkan ke “Langkah 5: Tambahkan Nomor Telepon,” klik Tambahkan nomor telepon.
  • Berikan rincian yang diperlukan dalam formulir berikut.
  • Verifikasi nomor Anda menggunakan kode yang diterima.
  • Setelah berhasil ditambahkan, pilih nomor telepon Anda di Langkah 1 Penyiapan API.

5. Tambahkan Metode Pembayaran

  • Untuk mengirim pesan melalui WhatsApp, Anda memerlukan metode pembayaran yang valid. Kunjungi di sini untuk detailnya.
  • Setelah menambahkan nomor telepon bisnis Anda, klik “Tambahkan metode pembayaran” untuk mengatasi peringatan “Metode pembayaran valid tidak ada”.
  • Anda akan diarahkan ke pengaturan akun WhatsApp Anda. Klik “Metode Pembayaran” > “Tambahkan metode pembayaran bisnis” dan ikuti petunjuk untuk menambahkan informasi kartu Anda.

6. Uji Nomor Bisnis baru Anda untuk WhatsApp

  • Kembali ke Dasbor Pengembang WhatsApp, navigasikan ke Pengaturan API
  • Masukkan nomor “Kepada” pengujian.
  • Klik "Kirim pesan" untuk memverifikasi pengiriman pesan yang berhasil.

Langkah 4: Konfigurasikan pengaturan Webhook API WhatsApp

1. Verifikasi Panggilan Balik WhatsApp Webhook.

  • Di Dasbor Pengembang WhatsApp, navigasikan ke Konfigurasi.
  • Di bawah Webhook, klik edit
  • Sekarang, kita perlu memberikan URL webhook langsung dan token ke WhatsApp. URL aktif adalah URL aplikasi Anda, dan token juga dihasilkan dari pihak Anda. Pada gambar di bawah, saya telah menambahkan URL Ngrok saya karena aplikasi Node.js saya berjalan di Ngrok, dan saya telah menggunakan UUID sebagai token.
  • Dalam proses verifikasi, WhatsApp mengirimkan permintaan GET ke URL panggilan balik untuk memvalidasi token hub. Kode berikut, yang ditulis dalam Next.js (kerangka kerja Node.js), menangani proses verifikasi ini. Verifikasi hanya akan berhasil jika kode Anda mengirimkan 200 kode status sebagai tanggapan, seperti yang ditunjukkan di bawah ini.
ekspor fungsi async GET(req: NextRequest) {

biarkan hubMode = req.nextUrl.searchParams.get("hub.mode");

biarkan hubChallenge = req.nextUrl.searchParams.get("hub.challenge");

biarkan hubToken = req.nextUrl.searchParams.get("hub.verify_token");

//temukan token di database

jika (

hubMode === "berlangganan" &&

hubToken === "<nilai dari .env ATAU dari database>"

) {

console.log("berhasil diverifikasi");

kembalikan Respon baru (hubChallenge);

}

return new Response("Kredensial Tidak Valid", { status: 400 });

}

  • Temukan bidang “pesan” dan berlanggananlah dengan mencentang kotak.
  • Sekarang kita memerlukan token Akses WhatsApp dan rahasia aplikasi Facebook yang kita dapatkan dari akun bisnis WhatsApp yang sama
  • Pada gambar di bawah Anda melihat aplikasi Facebook dikeluarkan

kita juga perlu menyimpan data yang disorot berikut ini

Dalam kode kita, kita memerlukan berbagai pengidentifikasi seperti token akses, rahasia aplikasi, nomor tes, ID nomor telepon, dan ID akun bisnis. Pengidentifikasi ini membantu kami menentukan dari siapa kami menerima pesan dan kepada siapa kami perlu mengirim pesan.

Langkah 5: Mengirim dan Menerima pesan melalui API

  • Pada kode TypeScript yang disediakan, kami telah berhasil mengintegrasikan API WhatsApp untuk mengirim dan menerima pesan. Selain itu, saya telah memasukkan OpenAI dan model AI yang dilatih khusus untuk merespons pesan masuk, untuk tujuan saya.
  • URL panggilan balik yang diberikan ke WhatsApp digunakan untuk permintaan GET dan POST. Saat pesan dikirim ke nomor bisnis, WhatsApp memicu URL panggilan balik ini dan mengirimkan pesan beserta detail pengguna. Kode berikut membaca pesan itu dan merespons berdasarkan logika yang diterapkan.
  • Fungsi POST adalah fungsi asinkron yang menangani permintaan POST masuk. Ini pertama-tama mem-parsing permintaan masuk ke JSON dan mengekstrak pesan yang dikirim oleh pengguna dari WhatsApp. Jika pesan tidak ditentukan atau kosong, pesan akan mengembalikan respons dengan status 200 dan tidak melanjutkan lebih jauh.
  • Fungsi tersebut kemudian mengambil nomor telepon bisnis dan nomor telepon pengirim dari permintaan.
  • Fungsi tersebut kemudian menyiapkan permintaan POST untuk mengirim pesan kembali ke pengguna melalui WhatsApp. Ini membuat URL untuk permintaan, mendefinisikan pesan yang akan dikirim, dan mengatur opsi permintaan, termasuk metode, header, dan isi.
  • Fungsi tersebut kemudian mengirimkan permintaan menggunakan fungsi pengambilan. Jika permintaan berhasil, ia akan mengembalikan respons dengan status 200. Jika suatu saat terjadi kesalahan, kesalahan tersebut akan dicatat ke konsol.
  • Fungsi getResponseNumber adalah fungsi pembantu yang mengekstrak nomor telepon pengirim dari permintaan masuk.
  • Kode ini memberikan contoh dasar tentang cara mengintegrasikan aplikasi Node.js dengan WhatsApp Business API, sehingga memungkinkan pengiriman dan penerimaan pesan secara otomatis.

// WhatsApp akan memicu permintaan postingan ini setelah pengguna mengajukan pertanyaan ke bot dan juga merespons pengguna

ekspor fungsi async POST(req: NextRequest) {

biarkan res: any = menunggu req.json();

biarkan pertanyaanDariWhatsapp =

res?.entry?.[0]?.changes?.[0]?.value?.messages?.[0]?.text?.body; // pertanyaan diterima dari whatsapp

jika (

pertanyaanDariWhatsapp == tidak ditentukan ||

questionFromWhatsapp.trim().length <= 0

) {

//jika permintaan hanya tentang status jangan melangkah lebih jauh

// return NextResponse.json({ pesan: "diterima" });

return Respon baru("diterima", { status: 200 });

}

//dapatkan id nomor telepon dari respons. nomor telepon ini adalah nomor bisnis

const nomor teleponId =

res?.entry?.[0]?.changes?.[0]?.value?.metadata["phone_number_id"];

//metode ini akan mengembalikan nomor telepon pengirim pesan

const respondNumber = getResponseNumber(res);

// mengambil userId dari database

mencoba {

versi const = "v18.0";

//periksa apakah batasnya tercapai atau belum

const nomor telepon;

const receiverPhoneNumber = "+" + respondNumber;

// const accessToken = proses.env.WHATSAPPTOKEN

const accessToken = "token yang Anda dapatkan dari facebook";

mencoba {

//--------------- Kode ini untuk mengirim pesan ke telegram

const url = `https://graph.facebook.com/${version}/${phoneNumberId}/messages`;

// Tentukan data yang akan dikirim dalam isi permintaan

data konstan = {

produk_pesan: "whatsapp",

receiver_type: "individu",

ke: `${recipientPhoneNumber}`,

ketik: "teks",

teks: {

pratinjau_url: salah,

body: "Hai, saya seorang chatbot, saya sedang sibuk, saya akan segera menghubungi Anda kembali.",

},

};

// Tentukan opsi untuk permintaan pengambilan

opsi konstan = {

metode: "POSTING",

tajuk: {

"Tipe Konten": "aplikasi/json",

Otorisasi: `Pembawa ${accessToken}`,

},

isi: JSON.stringify(data),

};

// Buat permintaan POST menggunakan ambil

mencoba {

const respon = menunggu pengambilan(url, opsi);

if (!response.ok) {

melempar Kesalahan baru(`Kesalahan HTTP! Status: ${response.status}`);

}

const data = menunggu respon.json();

// Tangani data sesuai kebutuhan

} tangkapan (kesalahan) {

// Tangani kesalahan sesuai kebutuhan

konsol.log(kesalahan);

}

return Respon baru("diterima", { status: 200 });

} tangkapan (kesalahan) {

console.log("kesalahan", kesalahan);

}

} tangkapan (kesalahan: apa saja) {

konsol.log(kesalahan);

//menjaga error log in database, jika terjadi error yang tidak dapat ditangani

}

}

const getResponseNumber = (res: apa saja) => {

return res?.entry?.[0]?.changes?.[0]?.value?.contacts[0]?.wa_id;

};

Kesimpulan

Dalam panduan komprehensif ini, kami telah menavigasi seluk-beluk pengintegrasian WhatsApp Business API dengan aplikasi Node.js. Dari menyiapkan webhook hingga memproses pesan masuk dan mengirim respons yang disesuaikan, kami telah membahas langkah-langkah penting seperti menangani token akses, rahasia aplikasi, nomor pengujian, ID nomor telepon, dan ID akun bisnis.

Integrasi yang lancar ini tidak hanya memberdayakan bisnis untuk mengotomatiskan komunikasi di WhatsApp namun juga membuka segudang kemungkinan, baik itu membuat bot dukungan pelanggan, mengotomatiskan upaya pemasaran, atau menjalankan proyek pribadi. Saat Anda memulai perjalanan ini, ingatlah bahwa ini hanyalah sebuah fondasi. WhatsApp Business API menawarkan sejumlah fitur tambahan yang menunggu untuk dijelajahi dan diintegrasikan ke dalam aplikasi Anda.

Saat Anda terus menyempurnakan upaya pengembangan chatbot AI, pertimbangkan untuk memanfaatkan keahlian seorang Perusahaan Pengembangan AI Chatbot . Wawasan dan dukungan mereka dapat mempercepat kemajuan Anda, memastikan upaya chatbot Anda mencapai potensi penuhnya. Selalu mengacu pada dokumentasi resmi WhatsApp Business API untuk informasi yang komprehensif dan akurat seiring kemajuan Anda dalam perjalanan pengembangan.