Dengan integrasi, interaksi pengguna akhir akan ditangani untuk Anda. Anda hanya perlu membangun agen, menerapkan webhook (opsional), dan mengonfigurasi integrasi.
Panduan ini menunjukkan cara menggunakan integrasi Dialogflow CX Messenger untuk menyediakan antarmuka pengguna chat teks sederhana bagi agen Anda.
Sebelum memulai
Jika tidak berencana menggunakan integrasi, Anda dapat melewati panduan memulai ini.
Anda harus melakukan hal berikut sebelum membaca panduan ini:
- Baca dasar-dasar alur.
- Lakukan langkah-langkah penyiapan.
- Lakukan langkah-langkah dalam panduan memulai Membangun agen menggunakan alur. Langkah-langkah di bawah ini melanjutkan pekerjaan pada agen yang sama. Jika Anda tidak lagi memiliki agen tersebut, Anda dapat mendownload agen dan memulihkannya.
Penyiapan
Untuk menyiapkan akses yang tidak diautentikasi ke agen Dialogflow CX Messenger Anda:
- Buka konsol Dialogflow CX.
- Pilih project Google Cloud Anda.
- Pilih agen Anda.
- Pilih tab Kelola.
- Klik Integrations di menu sidebar kiri.
- Klik Connect di Dialogflow CX Messenger.
- Dialog konfigurasi akan terbuka.
- Jika integrasi telah disiapkan sebelumnya untuk agen ini, Anda akan melihat kode HTML yang dapat disematkan. Terlepas dari apakah Anda menginginkan yang diautentikasi atau tidak diautentikasi, klik tombol Disable... di bagian bawah dialog, sehingga Anda dapat mengonfigurasi ulang setelan di langkah berikutnya.
- Pilih Environment.
- Pilih Unauthenticated API.
- Pilih gaya.
- Secara opsional, batasi akses domain.
- Klik Enable the unauthenticated API.
- Dialog akan menampilkan kode HTML yang dapat disematkan di situs Anda. Salin kode ini.
- Klik Done.
Penyematan
Tempelkan kode sematan yang Anda salin di atas ke halaman web di situs Anda.
Elemen HTML <script> dan <df-messenger>
harus berada di elemen <body> halaman Anda.
Jika Anda menggunakan integrasi yang diautentikasi,
tetapkan atribut oauth-client-id untuk <df-messenger>
ke client ID OAuth Anda. Dan jika Anda ingin menggunakan identitas pengguna akhir untuk autentikasi
alat,
tetapkan atribut access-token-name dengan nama apa pun yang Anda inginkan.
Kemudian, gunakan Token Pemilik dengan nilai $session.params.ACCESS_TOKEN_NAME
untuk autentikasi alat.
Perbarui atribut lain yang perlu diperbarui.
Untuk memungkinkan tata letak responsif,
tambahkan juga hal berikut ke elemen <head> Anda:
<meta name="viewport" content="width=device-width, initial-scale=1">
Setelah disematkan, Anda dapat berinteraksi dengan agen melalui halaman web dengan mengklik ikon chat di pojok kanan bawah.
Sesuaikan
Anda dapat menyesuaikan tampilan dan perilaku antarmuka pengguna ini dengan berbagai cara. Lihat dokumentasi Dialogflow CX Messenger untuk mengetahui informasi selengkapnya.