Peristiwa SDK web tanpa UI

SDK web headless menyediakan peristiwa yang dapat Anda proses untuk menangani tindakan atau update tertentu dalam aplikasi Anda.

const handleReady = () => {
  console.log("**** client is ready")
}

client.on("ready", handleReady)

// client.off("ready", handleReady)

Acara umum

Berikut adalah peristiwa umum untuk SDK

ready

Dipancarkan saat klien siap untuk berkomunikasi.

client.on("ready", () => {
})

authenticated

Dipancarkan saat klien telah melakukan autentikasi dengan token pengguna.

client.on("authenticated", () => {
})

Semua acara yang tersedia

SDK menyediakan berbagai peristiwa yang dapat Anda proses untuk menangani tindakan atau update tertentu dalam aplikasi Anda.

Anda dapat menambahkan dan menghapus pemroses peristiwa menggunakan metode .on dan .off.

const handleReady = () => {
  console.log(" client is ready")
}
client.on("ready", handleReady)
// client.off("ready", handleReady)

Berikut adalah daftar lengkap semua peristiwa yang tersedia:

Acara global

Nama peristiwa Deskripsi
ready Dipancarkan saat klien siap untuk berkomunikasi

Peristiwa yang tidak digunakan lagi

SDK terus memunculkan peristiwa berikut untuk kompatibilitas mundur. Jangan gunakan dalam integrasi baru.

Nama peristiwa Deskripsi Panduan
authenticated Dimunculkan saat klien telah diautentikasi dengan token pengguna Tidak digunakan lagi dan akan dihapus. Integrasi yang ada dapat terus menerimanya hingga dihapus.
chat.connected Dipancarkan saat chat terhubung dengan penyedia. Tidak digunakan lagi. Gunakan chat.connectedMessages, yang juga menyediakan payload pesan awal.

Peristiwa chat

Nama peristiwa Deskripsi
chat.ongoing Dikeluarkan saat ada percakapan yang sedang berlangsung.
chat.updated Dikeluarkan saat instance chat telah diperbarui.
chat.message Dikeluarkan saat ada pesan baru.
chat.memberJoined Dipancarkan saat anggota baru bergabung ke percakapan.
chat.memberLeft Dipancarkan saat anggota keluar dari percakapan.
chat.typingStarted Dipancarkan saat anggota mulai mengetik.
chat.typingEnded Dipancarkan saat anggota selesai mengetik.
chat.connectedMessages Dipancarkan saat SDK terhubung ke percakapan dengan penyedia.
chat.disconnected Dipancarkan saat chat terputus dari penyedia.
chat.dismissed Dimunculkan saat status chat diubah menjadi dismissed.
chat.timeout Dikeluarkan saat chat diakhiri karena "waktu tunggu habis".
chat.ended Dikeluarkan saat chat diakhiri.
chat.destroyed Dikeluarkan saat destroyChat dipanggil.
chat.checkInRequested Dikeluarkan saat chat dapat di-check in.
chat.checkInTimedOut Dikeluarkan saat waktu pemeriksaan chat habis

Peristiwa cobrowse

Nama peristiwa Deskripsi
cobrowse.request Dimunculkan saat pengguna akhir atau agen meminta cobrowse
cobrowse.loaded Dikeluarkan saat sesi cobrowse dimuat
cobrowse.updated Dikeluarkan saat sesi cobrowse diperbarui
cobrowse.ended Dikeluarkan saat sesi cobrowse berakhir

Contoh penggunaan

client.on("ready", () => {
  // Client is ready
})
client.on("chat.message", message => {
  console.log(message)
})
client.on("chat.connectedMessages", async ({ chat, messages }) => {
  // Handle chat and messages
})
client.on("cobrowse.request", ({ from }) => {
  console.log("Cobrowse requested by", from)
})

Konfigurasi data kustom

Opsi custom_data memungkinkan Anda meneruskan data key-value pair arbitrer ke SDK web.

Penggunaan

Anda dapat memberikan data kustom sebagai objek (tidak ditandatangani) atau string (ditandatangani) saat membuat chat:

interface ChatRequest {
  lang?: string;
  trigger_id?: string;
  ticket_id?: string;
  email?: string;
  greeting?: string;
  cobrowsable?: boolean;
  custom_data?: {
    signed?: string;
    unsigned?: Record<string, any>;
  };
}

Contoh

Lihat contoh berikut:

const custom_data = {
  unsigned: {
    version: {
      label: 'Version',
      value: '1.0.0'
    }
  },
  signed: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...' // JWT or other signed payload
}

try {
  const chat: Chat = await client.createChat(123, { custom_data })
} catch (error) {
  // handle error
}

Pengalihan chatbot eksternal

Ada beberapa kasus saat Anda mungkin ingin mempertahankan histori dan interaksi dari penyedia chat lain. Anda dapat melakukannya menggunakan custom_data object.

Lihat contoh berikut:

cconst custom_data = {
  unsigned: {
    external_chat_transfer: {
      greeting_override: "Please hold while we connect you with a human agent.",
      agent: {
        name: "Agent Name",
        avatar: "https://ujet.s3.amazonaws.com/default-virtual-agent-avatar-1.png"
      },
      transcript: [
        {
          sender: "agent",
          timestamp: "2021-03-15 12:00:00Z",
          content: [
            {
              type: "text",
              text: "Hello! How can I help you today?"
            },
            {
              type: "buttons",
              buttons: [
                {
                  label: "Create New Order",
                  selected: false
                },
                {
                  label: "Check Order Status",
                  selected: true
                },
                {
                  label: "Check Account Balance",
                  selected: false
                },
              ]
            }
          ]
        },
        {
          sender: "end_user",
          timestamp: "2021-03-15 12:00:15Z",
          content: [
            {
              type: "text",
              text: "Check Order Status"
            }
          ]
        },
        {
          sender: "agent",
          timestamp: "2021-03-15 12:00:16Z",
          content: [
            {
              type: "text",
              text: "I can help you with that, what's your order number?"
            }
          ]
        },
        {
          sender: "end_user",
          timestamp: "2021-03-15 12:00:20Z",
          content: [
            {
              type: "media",
              media: {
                type: "image",
                url: "https://ujet.s3.amazonaws.com/default-virtual-agent-avatar-1.png"
              }
            }
          ]
        }
      ]
    }
  },
  signed: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...' // JWT or other signed payload
}

try {
  const chat: Chat = await client.createChat(123, { custom_data })
} catch (error) {
  // handle error
}