시작하기

설치

AI-Assisted Setup으로 플러그인을 설치할 수 있습니다. 다음 명령어로 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.

수동 설정을 선호한다면, 다음 명령어를 실행하여 플러그인을 설치하고 아래의 플랫폼별 지침을 따르세요:

bun add @capgo/capacitor-crisp
bunx cap sync

가져오기

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

빠른 시작

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.configure({ websiteID: 'your-website-id' });
await CapacitorCrisp.setUser({ nickname: 'Ada', email: 'ada@example.com' });
await CapacitorCrisp.openMessenger();

예시: push token

await CapacitorCrisp.registerPushToken({ token: apnsOrFcmToken });

자주 하는 실수

• 한 번만 설정: 호출 configure() 메신저를 열기 전에.
• 로그아웃 시 초기화: reset() Crisp 세션을 삭제합니다.
• 웹: push helpers는 모바일 전용입니다.

API 개요

configure

웹사이트 ID로 Crisp SDK를 설정합니다. 다른 메서드를 호출하기 전에 반드시 먼저 호출해야 합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.configure({ websiteID: 'YOUR_WEBSITE_ID' });

openMessenger

Crisp 메신저 채팅창을 엽니다. 사용자에게 채팅 인터페이스를 보여줍니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.openMessenger();

setTokenID

현재 사용자 세션에 고유한 token ID를 설정합니다. 이전 대화 내용을 식별하고 복구하는 데 사용됩니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.setTokenID({ tokenID: 'token-id-123' });

setUser

현재 세션의 사용자 정보를 설정합니다. 지원 에이전트에게 표시되는 사용자 프로필을 업데이트합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.setUser({
  nickname: 'John Doe',
  email: 'john@example.com',
  phone: '+1234567890'
});

pushEvent

Crisp로 커스텀 이벤트를 전송합니다. 사용자의 행동 및 동작을 추적할 때 유용합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.pushEvent({
  name: 'completed_purchase',
  color: 'green'
});

setCompany

현재 세션의 회사 정보를 설정합니다. 사용자를 Crisp 내의 특정 회사와 연결합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.setCompany({
  name: 'Acme Corp',
  url: 'https://acme.com',
  employment: ['CEO', 'Executive'],
  geolocation: ['USA', 'San Francisco']
});

setInt

커스텀 정수 데이터 필드를 설정합니다. 사용자 세션과 연결된 숫자 데이터를 저장합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.setInt({ key: 'user_level', value: 42 });

setString

커스텀 문자열 데이터 필드를 설정합니다. 사용자 세션과 연결된 텍스트 데이터를 저장합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.setString({ key: 'subscription_tier', value: 'premium' });

sendMessage

사용자가 채팅 메시지를 보냅니다. 사용자가 직접 입력한 것처럼 메시지를 프로그래밍 방식으로 전송합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.sendMessage({ value: 'Hello, I need help!' });

setSegment

타겟팅 및 관리를 위한 사용자 세그먼트를 설정합니다. Crisp dashboard에서 사용자를 분류할 때 사용합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.setSegment({ segment: 'premium-users' });

reset

Crisp 세션을 초기화합니다. 모든 사용자 데이터를 삭제하고 새로운 세션을 시작합니다. 사용자가 로그아웃할 때 유용합니다.

import { CapacitorCrisp } from '@capgo/capacitor-crisp';

await CapacitorCrisp.reset();

타입 레퍼런스

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

Crisp 이벤트에 사용할 수 있는 색상입니다. Crisp dashboard에서 이벤트를 시각적으로 분류할 때 사용합니다.

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

Source of Truth

이 페이지는 플러그인의 src/definitions.tsupstream에서 public API가 변경되면 sync를 다시 실행하세요.

시작하기 다음 단계

사용 중이라면 시작하기 대시보드 및 API 운영을 계획하려면, 이를 다음과 연결하세요 @capgo/capacitor-crisp 사용법 @capgo/capacitor-crisp를 사용하여 Native Build 기능을 구현하려면, API 개요 구현 세부 사항은 API 개요에서 소개 구현 세부 사항은 소개에서 API 키 API Keys의 구현 세부 사항은, 기기 Devices의 구현 세부 사항은.