시작하기
설치 단계와 이 플러그인의 전체 마크다운 가이드를 포함한 설정 프롬프트 복사
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 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.만약 Manual Setup을 선호한다면, 다음 명령어를 실행하고 아래의 플랫폼별 지침을 따르세요:
bun add @capgo/capacitor-crispbunx cap syncImport
Import 섹션import { CapacitorCrisp } from '@capgo/capacitor-crisp';API 개요
섹션: API 개요configure
섹션: configureCrisp SDK을 설정하세요. 웹사이트 ID를 입력하세요. 다른 메서드를 사용하기 전에 반드시 호출해야 합니다.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.configure({ websiteID: 'YOUR_WEBSITE_ID' });openMessenger
openMessengerCrisp 메신저 대화 창을 열어 주세요. 사용자에게 대화 인터페이스를 보여줍니다.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.openMessenger();setTokenID
setTokenID현재 사용자 세션에 고유한 토큰 ID를 설정하세요. 이전 대화 복원 및 사용자 식별을 위해 사용됩니다.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.setTokenID({ tokenID: 'token-id-123' });setUser
setUser현재 세션에 사용자 정보를 설정하세요. 지원 대리인에게 표시되는 사용자 프로필을 업데이트합니다.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.setUser({ nickname: 'John Doe', email: 'john@example.com', phone: '+1234567890'});pushEvent
pushEventCrisp에 사용자 행동 및 행위 추적을 위한 커스텀 이벤트를 푸시하세요.
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
setInt사용자 세션에 숫자 데이터를 저장합니다.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.setInt({ key: 'user_level', value: 42 });setString
setString사용자 세션에 텍스트 데이터를 저장합니다.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.setString({ key: 'subscription_tier', value: 'premium' });sendMessage
sendMessage사용자가 채팅에 메시지를 보냅니다. 프로그램적으로 사용자가 입력한 것처럼 메시지를 보냅니다.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.sendMessage({ value: 'Hello, I need help!' });setSegment
세그먼트 설정사용자를 분류하기 위해 Crisp 대시보드에서 사용하는 세그먼트 설정.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.setSegment({ segment: 'premium-users' });reset
리셋사용자 데이터를 모두 지우고 새로운 세션을 시작하는 Crisp 세션 리셋.
import { CapacitorCrisp } from '@capgo/capacitor-crisp';
await CapacitorCrisp.reset();타입 참조
ConfigureOptionsConfigureOptions
초기화 시 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 대시보드에서 이벤트를 시각적으로 분류하기 위해 사용됩니다.
export type eventColor = | 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'purple' | 'pink' | 'brown' | 'grey' | 'black';실질적인 출처
실질적인 출처 섹션이 페이지는 플러그인의 src/definitions.ts공개 API이 업스트림에서 변경될 때 다시 싱크를 실행하세요.
Getting Started에서 계속
Getting Started에서 계속 섹션이벤트 색상 시작하기 Getting Started을 사용하여 대시보드와 API를 계획하고 운영할 경우에 @capgo/capacitor-크립스 사용 for the native capability in Using @capgo/capacitor-crisp API 개요 for the implementation detail in API Overview Introduction for the implementation detail in Introduction API 키 for API 구현 세부 사항에 대한 장치 for the implementation detail in 장치.