はじめに
このプラグインのインストール方法とフル マークダウン ガイドを含むセットアップ プレースメントをコピーします。
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-crisp`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/crisp/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
インストール
「インストール」のセクションAI-Assisted セットアップを使用してプラグインをインストールできます。AI ツールに Capgo スキルを追加するには、以下のコマンドを実行してください。
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins次に、以下のプロンプトを使用してください。
Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-crisp` plugin in my project.Manual セットアップを使用する場合は、以下のコマンドを実行してプラグインをインストールし、以下のプラットフォーム固有の指示に従ってください。
bun add @capgo/capacitor-crispbunx cap syncインポート
「インポート」のセクションimport { CapacitorCrisp } from '@capgo/capacitor-crisp';API オーバービュー
API オーバービューのセクションconfigure
セクション "configure"SDK を使用して、ウェブサイト ID を設定します。 他のメソッドを使用する前に、必ず実行してください。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.configure({ websiteID: 'YOUR_WEBSITE_ID' });openMessenger
セクション "openMessenger"Crisp メッセンジャー チャット ウィンドウを開きます。 ユーザーにチャット インターフェイスを表示します。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.openMessenger();setTokenID
セクション "setTokenID"現在のユーザー セッションに一意のトークン ID を設定します。 前回の会話を識別して復元します。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.setTokenID({} as { tokenID: string });setUser
Section titled “setUser”現在のセッションのユーザー情報を設定します。 サポートエージェントが見るユーザープロフィールを更新します。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setUser({ nickname: 'John Doe', email: 'john@example.com', phone: '+1234567890'});pushEvent
Section titled “pushEvent”Crispにカスタムイベントをプッシュします。 ユーザー行動や動作を追跡するのに役立ちます。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.pushEvent({ name: 'completed_purchase', color: 'green'});setCompany
Section titled “setCompany”現在のセッションの会社情報を設定します。 Crispでユーザーと会社を関連付けます。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setCompany({ name: 'Acme Corp', url: 'https://acme.com', employment: ['CEO', 'Executive'], geolocation: ['USA', 'San Francisco']});setInt
Section titled “setInt”カスタム整数データフィールドを設定します。 ユーザーセッションに関連付けられた数値データを保存します。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setInt({ key: 'user_level', value: 42 });setString
セクションのタイトル “setString”カスタム文字列データフィールドを設定します。 ユーザーセッションに関連付けられたテキストデータを保存します。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setString({ key: 'subscription_tier', value: 'premium' });sendMessage
セクションのタイトル “sendMessage”ユーザーからチャットにメッセージを送信します。 ユーザーが入力したようにメッセージをプログラム的に送信します。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.sendMessage({ value: 'Hello, I need help!' });setSegment
セクションのタイトル “setSegment”ユーザーをターゲットと組織化するためにセグメントを設定します。 Crisp ダッシュボードでユーザーをカテゴリ化するために使用されます。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CrispPlugin.setSegment({ segment: 'premium-users' });reset
セクションのタイトル “reset”Crisp セッションをリセットします。 ユーザー データをすべてクリアし、新しいセッションを開始します。 ユーザーがログアウトしたときに便利です。
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.reset();Type Reference
「Type Reference」ConfigureOptions
「ConfigureOptions」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;}eventColor
「eventColor」Crispイベントの可視化用の色。Crispダッシュボードでイベントをカテゴリ化するのに使用されます。
export type eventColor = | 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'purple' | 'pink' | 'brown' | 'grey' | 'black';ソース・オブ・トゥース
「ソース・オブ・トゥース」このページはプラグインの「.」から生成されています。 公開__CAPGO_KEEP_0__がアップストリームで変更されたら、再度Syncを実行してください。 src/definitions.ts. Re-run the sync when the public API changes upstream.
続けてGetting Started
「続けてGetting Started」というセクションCapgoを使用している場合 Getting Started Capgoを使用してダッシュボードとAPIの操作を計画するには、CapgoをAPIに接続する必要があります。 Capgoを使用して@capgo/capacitor-crispを使用 Capgoを使用して@capgo/capacitor-crispのネイティブ機能を使用 API Overview for the implementation detail in API Overview, Capgoの概要 Capgoの実装詳細 API Keys Capgoの実装詳細についてはAPIキーの詳細を参照してください デバイス Capgoの実装詳細についてはデバイスの詳細を参照してください。