JavaScript Messenger Dialogflow CX

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

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 untuk pesan dari pengguna akhir

Pengembalian:

  • 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.

Pengembalian:

  • 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

Pengembalian:

  • 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

Pengembalian:

  • 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 dari permintaan detectIntent Dialogflow CX API. Metode Dialogflow CX Messenger lainnya dapat menggantikan nilai default masing-masing dalam parameter kueri.

Argumen:

Pengembalian:

  • 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 sisa sesi.

Argumen:

  • object: data JSON, lihat dokumentasi personalisasi generatif

Pengembalian:

  • 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. Tindakan ini juga menghapus status dialog agen saat ini. Secara default, status autentikasi pengguna dipertahankan. 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 disetel ke benar (true), status autentikasi akan dihapus, jika tidak, status tersebut akan dipertahankan.

Pengembalian:

  • void

Contoh:

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

clearAuthentication

Fungsi ini menghapus autentikasi dialog agen.

Argumen:

  • tidak ada

Pengembalian:

  • void

Contoh:

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

startNewSession

Fungsi ini memulai sesi baru di dalam dialog agen. Secara default, perintah 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 disetel ke benar (true), histori akan disimpan, jika tidak, histori akan dihapus.
args.clearAuthentication boolean? Flag opsional untuk menghapus status autentikasi. Jika disetel ke benar (true), status autentikasi akan dihapus, jika tidak, status tersebut akan dipertahankan.

Pengembalian:

  • void

Contoh:

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

openChat

Fungsi ini akan membuka chat. Panggil di elemen df-messenger-chat-bubble untuk membuka percakapan. Tidak melakukan apa pun jika chat sudah terbuka.

Argumen:

  • tidak ada

Pengembalian:

  • void

Contohnya

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

closeChat

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

Argumen:

  • tidak ada

Pengembalian:

  • void

Contohnya

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 diminimalkan. Panggil di elemen df-messenger-chat-bubble untuk membuka chat yang diperkecil. Tidak melakukan apa pun jika chat sudah diminimalkan.

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. Setelan defaultnya adalah left-top.
args.showActorImages boolean? Tanda opsional untuk menampilkan gambar aktor (jika ditentukan pada elemen df-messenger-chat-bubble). Nilai defaultnya adalah salah (false).

Contoh:

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

closeMinChat

Menutup chat yang diperkecil. Panggil di elemen df-messenger-chat-bubble untuk menutup chat yang diminimalkan. Tidak melakukan apa pun jika percakapan sudah ditutup.

Contoh:

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