Zum Inhalt springen

Einstieg

Terminalfenster
bun add @capgo/capacitor-crisp
bunx cap sync
import { CapacitorCrisp } from '@capgo/capacitor-crisp';

configure

Konfigurieren

Konfigurieren Sie die Crisp SDK mit Ihrer Website-ID. Muss vor der Verwendung von anderen Methoden aufgerufen werden.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.configure({ websiteID: 'YOUR_WEBSITE_ID' });

Öffnen Sie das Chatfenster von Crisp. Zeigt dem Benutzer das Chatinterface.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.openMessenger();

Setzen Sie eine eindeutige Token-ID für die aktuelle Benutzersitzung. Wird verwendet, um vorherige Gespräche zu identifizieren und wiederherzustellen.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.setTokenID({} as { tokenID: string });

Setzen Sie Benutzerinformationen für die aktuelle Sitzung. Aktualisiert das Benutzerprofil, das den Supportagenten sichtbar ist.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setUser({
nickname: 'John Doe',
email: 'john@example.com',
phone: '+1234567890'
});

Senden Sie ein benutzerdefiniertes Ereignis an Crisp. Wird verwendet, um Benutzeraktionen und Verhalten zu tracken.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.pushEvent({
name: 'completed_purchase',
color: 'green'
});

Firmeninformationen für die aktuelle Sitzung festlegen. Der Benutzer wird mit einer Firma in Crisp verbunden.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setCompany({
name: 'Acme Corp',
url: 'https://acme.com',
employment: ['CEO', 'Executive'],
geolocation: ['USA', 'San Francisco']
});

Eine benutzerdefinierte Ganzzahl-Datenfeld festlegen. Zahlendaten, die mit der Benutzersitzung verbunden sind, speichern.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setInt({ key: 'user_level', value: 42 });

Ein benutzerdefiniertes Zeichenfolgen-Datenfeld festlegen. Textdaten, die mit der Benutzersitzung verbunden sind, speichern.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setString({ key: 'subscription_tier', value: 'premium' });

Ein Nachrichten von dem Benutzer an den Chat senden. Programmatisch eine Nachricht senden, als ob der Benutzer sie getippt hätte.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.sendMessage({ value: 'Hello, I need help!' });

Legen Sie einen Benutzersegment für die Zielgruppen und Organisation fest. Wird verwendet, um Benutzer in der Crisp-Dashboard-Kategorisierung zu klassifizieren.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setSegment({ segment: 'premium-users' });

Richten Sie die Crisp-Sitzung neu ein. Löscht alle Benutzerdaten und startet eine frische Sitzung. Wird nützlich, wenn sich der Benutzer abmeldet.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.reset();

Konfiguration für die Initialisierung von Crisp.

export interface ConfigureOptions {
/**
* Your Crisp website ID from dashboard.
*/
websiteID: string;
/**
* Optional - Locale to force in the Crisp chat widget (ISO 639-1), eg. `en`, `fr`, `es`.
* Web + Android: overrides the runtime locale. iOS follows the device/app locale.
*/
locale?: string;
/**
* Optional - Unique token identifier for the user session continuity.
*/
tokenID?: string;
}

Verfügbare Farben für Crisp-Ereignisse. Wird verwendet, um Ereignisse in der Crisp-Dashboard visuell zu kategorisieren.

export type eventColor =
| 'red'
| 'orange'
| 'yellow'
| 'green'
| 'blue'
| 'purple'
| 'pink'
| 'brown'
| 'grey'
| 'black';

Diese Seite wird aus dem Plugin generiert. src/definitions.ts. Wenn sich die öffentliche API upstream ändert, führen Sie die Synchronisation erneut durch.