JavaScript Dialogflow Messenger

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

renderCustomText

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

Argumen:

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

Kembalikan:

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

Kembalikan:

  • 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 API dan menunggu respons. Tindakan ini secara efektif melakukan simulasi input pengguna akhir yang biasanya disediakan ke dialog agen. Respons akan ditangani seperti kueri pengguna akhir.

Argumen:

  • string: kueri teks

Kembalikan:

  • Promise<void>: menampilkan nilai 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 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 merupakan string untuk kedua jenis permintaan yang didukung

Kembalikan:

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

Argumen:

Kembalikan:

  • void

Contoh:

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

setContext

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

Argumen:

  • object: Data JSON, lihat dokumentasi personalisasi generatif

Kembalikan:

  • 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 saat ini dari dialog agen.

Argumen:

  • tidak ada

Kembalikan:

  • void

Contoh:

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

clearAuthentication

Fungsi ini menghapus autentikasi dialog agen.

Argumen:

  • tidak ada

Kembalikan:

  • void

Contoh:

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

startNewSession

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

Argumen:

Nama Jenis Deskripsi
args object? Argumen opsional untuk mengonfigurasi pembuatan sesi baru.
args.retainHistory boolean? Tanda opsional untuk menyimpan histori. Jika ditetapkan ke benar (true), histori akan disimpan. Jika tidak, histori akan dihapus.

Kembalikan:

  • void

Contoh:

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

openChat

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

Argumen:

  • tidak ada

Kembalikan:

  • void

Contohnya

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

closeChat

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

Argumen:

  • tidak ada

Kembalikan:

  • void

Contohnya

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

openMinChat

Chat yang diperkecil Dialogflow Messenger

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

Argumen:

Nama Jenis Deskripsi
args objek? Argumen opsional untuk mengonfigurasi chat yang diperkecil
args.anchor ? 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 false (salah).

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();