JavaScript Messenger Dialogflow CX

Messenger Dialogflow CX menyediakan functions 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: true (benar) untuk pesan dari agen, false (salah) dari pengguna akhir

Kembali:

  • void

Contoh:

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

renderCustomCard

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

Argumen:

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

Kembali:

  • 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 mengirim kueri ke Dialogflow API dan menunggu responsnya. 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

Kembali:

  • 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 API dan menunggu responsnya.

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

Kembali:

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

Argumen:

Kembali:

  • void

Contoh:

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

setContext

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

Argumen:

  • object: Data JSON, lihat dokumentasi personalisasi generatif

Kembali:

  • 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 akan menghapus status dialog agen saat ini.

Argumen:

  • tidak ada

Kembali:

  • void

Contoh:

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

clearAuthentication

Fungsi ini menghapus autentikasi dialog agen.

Argumen:

  • tidak ada

Kembali:

  • void

Contoh:

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

startNewSession

Fungsi ini memulai sesi baru di dalam dialog agen. Tindakan ini dapat mempertahankan atau mereset histori pesan saat ini. Tindakan ini tidak menghapus autentikasi pengguna.

Argumen:

Nama Jenis Deskripsi
args object? Argumen opsional untuk mengonfigurasi pembuatan sesi baru.
args.retainHistory boolean? Flag opsional untuk mempertahankan histori. Jika disetel ke true, histori akan disimpan, jika tidak, histori akan dihapus.

Kembali:

  • 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 chat. Tidak melakukan apa pun jika chat sudah terbuka.

Argumen:

  • tidak ada

Kembali:

  • void

Contohnya

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

closeChat

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

Argumen:

  • tidak ada

Kembali:

  • void

Contohnya

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

openMinChat

Chat yang diperkecil di Messenger Dialogflow CX

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

Argumen:

Nama Jenis Deskripsi
args objek? 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? Flag 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 diperkecil. Tidak melakukan apa pun jika chat sudah ditutup.

Contoh:

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