Channels · App Chat · Mobile SDK
Flutter Mobile SDK
Embed native in-app support chat in your Flutter app using the same App Chat account as your website widget. The SDK uses the visitor widget API (not the business REST API documented for WhatsApp). Your backend signs short-lived identify_token JWTs after the user is identified in your app.
Portal setup
Enable SDK available and configure chat on App Chat → Mobile SDK → Flutter. Copy credentials from Details (public key). Set chat title, colors, business hours, and welcome message on the Flutter tab. Launcher icon, tagline, and position are website Widget tab settings only.
Identity is host-driven
Mobile SDK identity is notcontrolled by the website widget's Identity mode (Anonymous Recovery vs Trusted External ID). That setting applies to the embed script only. Your app chooses one of three patterns via Engagive.identifyUser, identifyAnonymous, or upgradeUser, plus the matching identity_kind in your backend token.
Trusted
User logged in — pass stable user id only. Default production pattern.
Anonymous
Pre-login guest chat — host generates and persists a guest id.
Upgrade
After login — merge guest history into the authenticated user.
Trust model (summary)
- Widget public key
- API base URL
- App bundle id / package name
- Widget secret key
identify_tokensigning (HS256, ~5 min TTL)
Quick start (Flutter)
import 'package:engagive_flutter_sdk/engagive_flutter_sdk.dart';
await Engagive.init(EngagiveConfig(
publicKey: 'YOUR_WIDGET_PUBLIC_KEY',
apiBaseUrl: 'https://api.engagive.io',
appIdentifier: 'com.yourcompany.app',
));
// After login — fetch identify_token from YOUR backend
await Engagive.identifyUser(
EngagiveUser(id: user.id, name: user.name, email: user.email),
identifyToken: tokenFromYourBackend,
);
await Engagive.openChat(context);
// Push with custom app-bar menu icon
await Engagive.openChat(
context,
appBarMenuIconAsset: 'assets/icons/chat-menu.png',
);
// Embedded tab — hide back button; host handles navigation
// const EngagiveChatScreen(showBackButton: false);Chat screen app bar (integrator)
Title and colors come from the portal Flutter tab. Back button, menu visibility, and menu icon are controlled in your app — not portal settings.
// Defaults: back button + ⋮ menu (restart conversation)
await Engagive.openChat(context);
// Custom menu trigger asset
await Engagive.openChat(
context,
appBarMenuIcon: Image.asset('assets/icons/chat-menu.png', width: 24, height: 24),
);
// Embedded child — no SDK back button
const EngagiveChatScreen(showBackButton: false);
// Hide app-bar menu entirely
const EngagiveChatScreen(showAppBarMenu: false);Visitor API base
SDK REST calls use the widget visitor prefix (same origin as your Engagive API deployment):
POST {apiBaseUrl}/api/widget/appchat/session
GET {apiBaseUrl}/api/widget/appchat/messages
WS {apiBaseUrl}/ws?accountId={id}&token={sessionJwt}Full documentation (monorepo)
Detailed integration guides live in the Engagive workspace alongside the SDK package:
projects/engagive-app-backend/docs/flutter-sdk/embedding-guide.md— production integrationprojects/engagive-app-backend/docs/flutter-sdk/identity-modes.md— anonymous, trusted, upgradeprojects/engagive-app-backend/docs/flutter-sdk/integration-testing.md— local E2E testingsdks/engagive_flutter_sdk/— Flutter package sourcedemos/engagive-flutter-demo/— reference demo app
Test tokens for QA: Engagive portal → App Chat → Mobile SDK → Developer test token (trusted, anonymous, and upgrade). Package version: v2.2.0.
Back to docs home