JavaScript Messenger Dialogflow CX

Dialogflow CX Messenger menyediakan fungsi yang dapat Anda panggil untuk memengaruhi perilaku.

renderCustomText

Fungsi ini merender pesan teks sederhana, seolah-olah berasal dari agen sebagai respons teks sederhana atau dimasukkan oleh pengguna akhir.

Argumen:

  • string: pesan teks
  • boolean: benar untuk pesan dari agen, salah dari pengguna akhir

Hasil:

  • void

Contoh:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.renderCustomText('Custom text', true);

renderCustomCard

Fungsi ini merender kartu kustom, seolah-olah berasal dari pemenuhan Dialogflow CX.

Argumen:

  • payload: daftar respons payload kustom, yang ditentukan di bagian Pemenuhan.

Hasil:

  • void

Contoh:

const dfMessenger = document.querySelector('df-messenger');
const payload = [
  {
    "type": "info",
    "title": "Info item title",
    "subtitle": "Info item subtitle",
    "image": {
      "rawUrl": "https://example.com/images/logo.png"
    },
    "anchor": {
      "href": "https://example.com",
      "target": "_blank"
    }
  }
];
dfMessenger.renderCustomCard(payload);

sendQuery

Fungsi ini mengirimkan kueri ke Dialogflow CX API dan menunggu respons. Hal ini secara efektif menyimulasikan input pengguna akhir yang biasanya diberikan ke dialog agen. Respons akan ditangani seperti kueri pengguna akhir lainnya.

Argumen:

  • string: kueri teks

Hasil:

  • Promise<void>: nilai yang ditampilkan untuk operasi asinkron

Contoh:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.sendQuery('Describe shipping costs.');

sendRequest

Fungsi ini mengirimkan permintaan ke Dialogflow CX API dan menunggu respons.

Argumen:

  • string: jenis permintaan, mendukung query (lihat juga sendQuery di atas) dan event (lihat peristiwa kustom)
  • any: payload yang sesuai dengan jenis permintaan, yang saat ini berupa string untuk kedua jenis permintaan yang didukung

Hasil:

  • Promise<void>: nilai yang ditampilkan untuk operasi asinkron

Contoh:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.sendRequest('query', 'Describe shipping costs.');

setQueryParameters

Fungsi ini menetapkan nilai default untuk kolom queryParams permintaan Dialogflow CX API detectIntent. Metode Dialogflow CX Messenger lainnya dapat mengganti nilai default masing-masing dalam parameter kueri.

Argumen:

Hasil:

  • void

Contoh:

const dfMessenger = document.querySelector('df-messenger');
const queryParameters = {
  parameters: {
  timeZone: "America/New_York"
  }
};
dfMessenger.setQueryParameters(queryParameters);

setContext

Fungsi ini mengirimkan informasi personalisasi generatif tentang pengguna akhir ke Dialogflow CX. Informasi ini akan tetap ada selama sesi.

Argumen:

  • object: data JSON, lihat dokumentasi personalisasi generatif

Hasil:

  • void

Contoh:

const dfMessenger = document.querySelector('df-messenger');
const metadata = {
  "subscription plan": "Business Premium Plus",
  "devices owned": [
    {
      model: "Google Pixel 7",
    },
    {
      model: "Google Pixel Tablet",
    },
  ],
};
dfMessenger.setContext(metadata);

clearStorage

Fungsi ini menghapus penyimpanan persisten dialog agen. Fungsi ini juga menghapus status dialog agen saat ini. Secara default, fungsi ini mempertahankan status autentikasi pengguna. Gunakan args opsional untuk menyesuaikan perilaku ini.

Argumen:

Nama Jenis Deskripsi
args object? Argumen opsional untuk mengonfigurasi operasi penyimpanan yang jelas.
args.clearAuthentication boolean? Flag opsional untuk menghapus status autentikasi. Jika ditetapkan ke benar, status autentikasi akan dihapus, jika tidak, status autentikasi akan dipertahankan.

Hasil:

  • void

Contoh:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.clearStorage();

clearAuthentication

Fungsi ini menghapus autentikasi dialog agen.

Argumen:

  • tidak ada

Hasil:

  • void

Contoh:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.clearAuthentication();

startNewSession

Fungsi ini memulai sesi baru di dalam dialog agen. Secara default, fungsi ini menghapus histori pesan, tetapi mempertahankan status autentikasi pengguna. Gunakan args opsional untuk menyesuaikan perilaku ini.

Argumen:

Nama Jenis Deskripsi
args object? Argumen opsional untuk mengonfigurasi pembuatan sesi baru.
args.retainHistory boolean? Flag opsional untuk mempertahankan histori. Jika ditetapkan ke benar, histori akan dipertahankan, jika tidak, histori akan dihapus.
args.clearAuthentication boolean? Flag opsional untuk menghapus status autentikasi. Jika ditetapkan ke benar, status autentikasi akan dihapus, jika tidak, status autentikasi akan dipertahankan.

Hasil:

  • void

Contoh:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.startNewSession({ retainHistory: true });

openChat

Fungsi ini membuka chat. Panggil fungsi ini pada elemen df-messenger-chat-bubble untuk membuka chat. Tidak melakukan apa pun jika chat sudah terbuka.

Argumen:

  • tidak ada

Hasil:

  • void

Contoh

const dfMessengerBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerBubble.openChat();

closeChat

Fungsi ini menutup chat. Panggil fungsi ini pada elemen df-messenger-chat-bubble untuk menutup chat. Tidak melakukan apa pun jika chat sudah ditutup.

Argumen:

  • tidak ada

Hasil:

  • void

Contoh

const dfMessengerBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerBubble.closeChat();

openMinChat

Chat yang diminimalkan di Messenger Dialogflow CX

Fungsi ini membuka jendela chat dalam versi yang diperkecil. Panggil fungsi ini pada elemen df-messenger-chat-bubble untuk membuka chat yang diperkecil. Tidak melakukan apa pun jika chat sudah diperkecil.

Argumen:

Nama Jenis Deskripsi
args object? Argumen opsional untuk mengonfigurasi chat yang diperkecil
args.anchor string? anchor opsional untuk mengonfigurasi tempat chat yang diperkecil dibuka. Logika yang sama dengan atribut anchor pada elemen balon chat. Defaultnya adalah left-top.
args.showActorImages boolean? Flag opsional untuk menampilkan gambar aktor (jika ditentukan pada elemen df-messenger-chat-bubble). Defaultnya adalah salah.

Contoh:

const dfMessengerChatBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerChatBubble.openMinChat({
  anchor: 'top-left'
});

closeMinChat

Menutup chat yang diperkecil. Panggil fungsi ini pada elemen df-messenger-chat-bubble untuk menutup chat yang diperkecil. Tidak melakukan apa pun jika chat sudah ditutup.

Contoh:

const dfMessengerChatBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerChatBubble.closeMinChat();