Événements du SDK Web headless

Le SDK Web sans interface utilisateur fournit des événements que vous pouvez écouter pour gérer des actions ou des mises à jour spécifiques dans votre application. Vous pouvez ajouter et supprimer des écouteurs d'événements à l'aide des méthodes .on et .off.

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

client.on("ready", handleReady)

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

Événements généraux

Voici des événements généraux pour le SDK.

ready

Émet lorsque le client est prêt à communiquer.

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

authenticated

Émis lorsque le client s'est authentifié avec le jeton de l'utilisateur.

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

Événements Chat

Voici des événements spécifiques aux sessions de chat.

chat.ongoing

Émet lorsque le chat est en cours.

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

chat.updated

Émet lorsque l'instance de chat a été mise à jour.

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

chat.message

Émet un événement lorsqu'un nouveau message est reçu.

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

Type de message :

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

  // extra parameters

}

chat.memberJoined

Émet lorsque un nouveau membre rejoint la conversation.

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

chat.memberLeft

Émis lorsqu'un membre quitte la conversation.

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

chat.typingStarted

Émet lorsque un membre commence à saisir du texte.

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

chat.typingEnded

Émet lorsque le membre arrête de saisir du texte.

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

chat.connected

Émis lorsque le chat est connecté au fournisseur de conversation.

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

Dans de rares cas, des problèmes de latence peuvent entraîner l'envoi d'un message dans un chat avant que le SDK ne rejoigne le chat. Dans ce cas, vous pouvez utiliser fetchMessages pour obtenir tous les messages existants dans une conversation une fois qu'un chat a été établi. Consultez l'exemple de code suivant :

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

chat.disconnected

Émet lorsque le chat est déconnecté du fournisseur de conversation.

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

chat.dismissed

Émet lorsque l'état du chat est défini sur dismissed.

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

chat.timeout

Émet lorsque le chat se termine, la raison étant timeout.

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

chat.ended

Émet lorsque le chat est terminé.

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

chat.destroyed

Émet lorsque destroyChat est appelé.

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

Enregistrement dans Chat

Voici les événements d'enregistrement de chat.

checkIn

Confirme la présence de l'utilisateur final dans la file d'attente.

Signature de la méthode

checkIn(): Promise<CheckInResponse>

Valeur renvoyée

Renvoie un objet CheckInResponse.

Interfaces

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',
}

Exemple

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

exitCheckIn

Supprime l'utilisateur de la file d'attente pour l'enregistrement.

Signature de la méthode

exitCheckIn(): Promise<CheckInResponse>

Valeur renvoyée

Renvoie un objet CheckInResponse.

Interfaces

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

Avertit le backend de l'état de visibilité de la boîte de dialogue d'enregistrement.

Signature de la méthode

notifyCheckInState(data: CheckInVisibilityStateRequest): Promise<void>

Interfaces

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

Replace l'utilisateur dans la file d'attente s'il n'a pas confirmé son enregistrement.

Signature de la méthode

rejoinChat(): Promise<CheckInResponse>

Valeur renvoyée

Renvoie un objet CheckInResponse.

Interfaces

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',
}

Exemple

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

trackCheckInEvent

Signaux envoyés au backend lorsque des événements d'enregistrement ont été déclenchés par l'UI. Cet événement est utilisé lorsque la boîte de dialogue d'enregistrement a été affichée à l'utilisateur final.

Signature de la méthode

trackCheckInEvent(): Promise<void>

Exemple

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

Événements de navigation conjointe

Voici des événements spécifiques au co-browsing :

cobrowse.request

Émis lorsqu'un utilisateur final ou un agent demande à démarrer une session de navigation conjointe.

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

cobrowse.loaded

Émet lorsque la session de navigation à plusieurs est chargée.

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

cobrowse.updated

Émet lorsque la session de navigation à plusieurs est mise à jour.

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

cobrowse.ended

Émet lorsque la session de navigation conjointe est terminée.

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