Eventi dell'SDK web headless

L'SDK web headless fornisce eventi che puoi ascoltare per gestire azioni o aggiornamenti specifici all'interno della tua applicazione. Puoi aggiungere e rimuovere i listener di eventi utilizzando i metodi .on e .off.

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

client.on("ready", handleReady)

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

Eventi generali

Di seguito sono riportati gli eventi generali per l'SDK

ready

Emesso quando il client è pronto per la comunicazione.

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

authenticated

Emesso quando il client ha eseguito l'autenticazione con il token dell'utente.

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

Eventi chat

Di seguito sono riportati gli eventi specifici della sessione di chat.

chat.ongoing

Emesso quando è in corso una chat.

client.on("chat.ongoing", (chat) => {
  console.log(chat)
})

chat.updated

Emesso quando l'istanza di chat è stata aggiornata.

client.on("chat.updated", (chat) => {
  // the `chat` property on `client` has updated
  console.log(chat)
})

chat.message

Emesso quando è presente un nuovo messaggio.

client.on("chat.message", message => {
  console.log(message)
})

Il tipo di messaggio:

interface MessageResponse {
  $index: number;
  $sid: string;
  $timestamp: Date;
  $userType: string;
  $userId: number;
  type: string;
  content?: string;
  event?: string;
  file?: File;

  // extra parameters
  [key: string]: unknown;
}

chat.memberJoined

Emesso quando un nuovo membro entra nella conversazione.

client.on("chat.memberJoined", (identity) => {
  console.log(identity)
})

chat.memberLeft

Emesso quando un membro abbandona la conversazione.

client.on("chat.memberLeft", (identity) => {
  console.log(identity)
})

chat.connected

Emesso quando la chat è connessa al fornitore della conversazione.

client.on("chat.connected", () => {
  console.log("connected")
})

In rari casi, potrebbero verificarsi problemi di latenza che causano l'invio di un messaggio in una chat prima che l'SDK partecipi alla chat. Quando si verifica questa situazione, puoi utilizzare fetchMessages per ottenere tutti i messaggi esistenti in una conversazione dopo che una chat è stata connessa. Vedi il seguente esempio di codice:

client.on("chat.connected", async () = {
  const messages = await
client.fetchMessages()
})

chat.disconnected

Emesso quando la chat viene disconnessa dal fornitore della conversazione.

client.on("chat.disconnected", () => {
  console.log("disconnected")
})

chat.dismissed

Emesso quando lo stato della chat viene modificato in dismissed.

client.on("chat.dismissed", () => {
  console.log("dismissed")
})

chat.timeout

Emesso al termine della chat, con il motivo timeout.

client.on("chat.timeout", () => {
  console.log("timeout")
})

chat.ended

Emesso al termine della chat.

client.on("chat.ended", () => {
  console.log("ended")
})

chat.destroyed

Emesso quando viene chiamato destroyChat.

client.on("chat.destroyed", () => {
  console.log("destroyed")
})

chat.checkInRequested

Emesso quando è possibile archiviare la chat.

chat.checkInTimedOut

Emesso quando il check-in della chat è scaduto.

Eventi di digitazione

Quando un agente inizia a digitare, l'adattatore chat invia un segnale che comporta l'invio dell'evento typingStarted all'SDK web headless. Quando l'agente smette di digitare, dopo tre secondi viene inviato un segnale che comporta l'invio di un evento typingEnded all'SDK web headless. Il timeout di tre secondi non è configurabile.

chat.typingStarted

Emesso quando un membro inizia a digitare.

client.on("chat.typingStarted", (identity) => {
  console.log(identity)
})

chat.typingEnded

Emesso quando un membro smette di digitare.

client.on("chat.typingEnded", (identity) => {
  console.log(identity)
})

Eventi di check-in della chat

Di seguito sono riportati gli eventi di check-in della chat.

checkIn

Conferma la presenza dell'utente finale nella coda.

Firma del metodo

checkIn(): Promise<CheckInResponse>

Valore restituito

Restituisce un oggetto CheckInResponse.

Interfacce

interface CheckInResponse {
  chat_id: number;
  check_in_status: CheckInStatus;
  check_in_at?: string;
}
enum CheckInStatus {
  CONFIRMED = 'confirmed',
  EXITED = 'exited',
  PENDING = 'pending',
  REQUESTED = 'requested',
  SKIPPED = 'skipped',
  TIMED_OUT = 'timed_out',
}

Esempio

try {
  const response = await client.checkIn()
} catch (error) {
  // handle error
}

exitCheckIn

Rimuove l'utente dalla coda di registrazione.

Firma del metodo

exitCheckIn(): Promise<CheckInResponse>

Valore restituito

Restituisce un oggetto CheckInResponse.

Interfacce

interface CheckInResponse {
  chat_id: number;
  check_in_status: CheckInStatus;
  check_in_at?: string;
}
enum CheckInStatus {
  CONFIRMED = 'confirmed',
  EXITED = 'exited',
  PENDING = 'pending',
  REQUESTED = 'requested',
  SKIPPED = 'skipped',
  TIMED_OUT = 'timed_out',
}

notifyCheckInState

Notifica al backend lo stato di visibilità della finestra di dialogo di check-in.

Firma del metodo

notifyCheckInState(data: CheckInVisibilityStateRequest): Promise<void>

Interfacce

interface CheckInVisibilityStateRequest {
  widget_minimized?: boolean;
  tab_inactive?: boolean;
}
**Example**

try {
  const visibilityState = {
    widget_minimized: true,
    tab_inactive: false,
  }
  await client.notifyCheckInState(visibilityState)
} catch (error) {
  // handle error
}

rejoinChat

Riporta l'utente in coda dopo il mancato completamento della conferma del check-in.

Firma del metodo

rejoinChat(): Promise<CheckInResponse>

Valore restituito

Restituisce un oggetto CheckInResponse.

Interfacce

interface CheckInResponse {
  chat_id: number;
  check_in_status: CheckInStatus;
  check_in_at?: string;
}
enum CheckInStatus {
  CONFIRMED = 'confirmed',
  EXITED = 'exited',
  PENDING = 'pending',
  REQUESTED = 'requested',
  SKIPPED = 'skipped',
  TIMED_OUT = 'timed_out',
}

Esempio

try {
  const response = await client.rejoinChat()
} catch (error) {
  // handle error

trackCheckInEvent

Segnali al backend quando gli eventi di check-in sono stati attivati dall'interfaccia utente. Questo viene utilizzato quando la finestra di dialogo di check-in è stata mostrata all'utente finale.

Firma del metodo

trackCheckInEvent(): Promise<void>

Esempio

try {
  await client.trackCheckInEvent()
} catch (error) {
  // handle error

Eventi di co-browsing

Di seguito sono riportati gli eventi specifici di Co-browsing:

cobrowse.request

Emesso quando un utente finale o un agente richiede di avviare una sessione di navigazione condivisa.

client.on("cobrowse.request", { from } => {
  console.log("request by", from)
})

cobrowse.loaded

Emesso quando viene caricata una sessione di navigazione condivisa.

client.on("cobrowse.loaded", session => {
  console.log("cobrowse session", session)
})

cobrowse.updated

Emesso quando una sessione di navigazione condivisa viene aggiornata.

client.on("cobrowse.updated", session => {
  console.log("cobrowse session", session)
})

cobrowse.ended

Emesso al termine di una sessione di navigazione condivisa.

client.on("cobrowse.ended", session => {
  console.log("cobrowse session", session)
})