§ 00Présentation
Le SDK Flutter parle le même protocole de widget anonyme que le chat de votre site web — vos clients peuvent donc joindre l'assistance depuis votre application mobile, sur les conversations mêmes que vos agents traitent déjà dans la boîte de réception partagée.
Il est livré sous la forme de deux paquets :
easylivechat— client de protocole headless avec état réactif, sans interfaceeasylivechat_ui— widgets prêts à l'emploi et personnalisables — lanceur, écran de chat, formulaire de pré-chat, pièces jointes, CSAT
§ 01Installation
Ajoutez le SDK au fichier pubspec.yaml de votre application. La plupart des applications souhaiteront easylivechat_ui — qui réexporte le cœur. N'optez pour le easylivechat headless seul que lorsque vous créez une interface entièrement personnalisée.
dependencies: easylivechat_ui: ^0.1.0 # prebuilt UI + the headless core # — or, headless only — easylivechat: ^0.1.0
Nécessite Flutter 3.19 ou une version plus récente. socket_io_client doit être une version 3.x (Engine.IO v4) pour correspondre au serveur.
§ 02Démarrage rapide (interface clé en main)
Amorcez le client une seule fois avec le slug de votre espace de travail, puis insérez un lanceur dans votre arborescence de widgets. La bulle ouvre un chat entièrement câblé : formulaire de pré-chat, fil en temps réel, indicateur de saisie, pièces jointes, CSAT, un formulaire hors ligne pour les horaires d'ouverture, ainsi qu'un thème piloté par le serveur et le RTL.
import 'package:easylivechat_ui/easylivechat_ui.dart';
await EasyLiveChat.instance.boot(
const EasyLiveChatConfig(
apiBase: 'https://api.livechattools.com',
tenantSlug: 'acme', // your workspace slug
),
storage: SecurePrefsStorage(), // durable visitorId + JWT
);
// In your widget tree — a floating bubble that opens the full chat:
Stack(children: [ MyApp(), const EasyLiveChatLauncher() ]);Retrouvez le slug de votre espace de travail dans votre tableau de bord. Le lanceur s'amorce de façon paresseuse à la première ouverture ; transmettez un stockage durable afin que l'identité du visiteur survive aux redémarrages de l'application.
§ 03Headless (créez votre propre interface)
Vous préférez votre propre système de design ? Pilotez directement le client headless. Tout est exposé sous forme de ValueListenables et de Streams que vous pouvez relier à n'importe quelle gestion d'état.
import 'package:easylivechat/easylivechat.dart';
final chat = EasyLiveChat.instance;
await chat.boot(const EasyLiveChatConfig(
apiBase: 'https://api.livechattools.com', tenantSlug: 'acme'),
storage: myDurableStorage); // implement EasyLiveChatStorage
await chat.open(); // config → resume → prechat/anon → connect
chat.messages.addListener(rebuild); // ValueListenable<List<ChatMessage>>
chat.agentTyping.addListener(rebuild);
final res = chat.sendMessage('Hello!'); // optimistic; res.serverMessageId on ack
await chat.submitFeedback(rating: 5);open() orchestre l'intégralité du cycle de vie : récupérer la configuration, reprendre toute conversation ouverte, filtrer via le formulaire de pré-chat ou démarrer anonymement, puis connecter le socket temps réel.
§ 04Fonctionnement
Lorsqu'une session s'ouvre, le serveur génère un jeton éphémère propre à chaque conversation. Le SDK l'utilise pour les appels REST et le socket temps réel, le régénère de manière transparente avant son expiration, et se reconnecte avec un rattrapage sans perte lorsque le réseau mobile tombe.
Tout est anonyme par défaut : le SDK génère un identifiant de visiteur durable sur l'appareil — aucune connexion requise — et recueille éventuellement un nom et une adresse e-mail via le formulaire de pré-chat du tenant.
Sécurité : n'intégrez jamais votre clé API de tenant dans une application distribuée — il s'agit d'un secret de serveur à serveur. Le SDK Flutter n'utilise jamais que le jeton de session propre à chaque visiteur, qui est sans danger pour un client distribué.
§ 05Ce qui nécessite un travail côté serveur
L'expérience de chat complète en premier plan fonctionne dès aujourd'hui sans aucune modification du backend. La seule fonctionnalité nécessitant un travail serveur est le push en arrière-plan — la remise d'une notification « un agent a répondu » à une application fermée — car le backend n'envoie actuellement des push qu'aux agents. Un registre de push pour les visiteurs et une diffusion sont nécessaires pour l'activer ; le hook de push du SDK reste inactif jusque-là.
Suites recommandées avant un lancement public : la limitation de débit sur la création de session et l'envoi de messages, un endpoint de rafraîchissement de jeton, et la prise en charge du téléversement HEIC/MOV pour les médias des téléphones.