Oi
OiChat
← 문서 목록
Flutter

Flutter 빠른 시작 가이드

5분 만에 Flutter 앱에 실시간 채팅을 추가하세요.

0사전 준비

1. OiChat 가입 (30초, 무료)

2. 대시보드에서 프로젝트 생성 → API Key 발급

3. Auth Mode 선택:

  • Client Mode — 백엔드 없이 Public Key만으로 바로 연동 (MVP, 1인 개발)
  • Server Mode — 자체 백엔드에서 JWT 발급 (프로덕션 권장)

1SDK 설치

terminal
flutter pub add oichat_sdk

2초기화 (Client Mode)

dart
import 'package:oichat_sdk/oichat_sdk.dart';

final oichat = OiChat(
  OiChatConfig(
    apiUrl: 'https://api.oichatapi.com',
    wsUrl: 'wss://ws.oichatapi.com/connection/websocket',
    publicKey: 'pk_여기에_퍼블릭키_입력',
  ),
);

// 연결
await oichat.connect(userId: 'user_123');
Server Mode를 사용한다면 publicKey 대신 token을 전달합니다. 자체 백엔드에서 API Key + Secret Key로 JWT를 생성하세요.

3채팅방 생성 & 메시지 전송

dart
// 1:1 채팅방 생성
final room = await oichat.rooms.createDirect(
  participantIds: ['user_456'],
);

// 메시지 전송
await oichat.messages.send(
  roomId: room.id,
  content: '안녕하세요! 👋',
);

4실시간 메시지 수신

dart
// 메시지 스트림 구독
oichat.messages.onMessage.listen((message) {
  print('${message.senderId}: ${message.content}');
});

// 타이핑 인디케이터
oichat.rooms.onTyping.listen((event) {
  print('${event.userId} is typing...');
});

5프리빌트 UI (선택)

UI를 직접 만들지 않아도 됩니다. oichat_ui 패키지로 채팅 화면을 바로 띄울 수 있습니다.

dart
import 'package:oichat_ui/oichat_ui.dart';

// 채팅 화면 위젯
OiChatView(
  client: oichat,
  roomId: room.id,
)

다음 단계

  • 라이브 데모에서 실시간 채팅 체험
  • 이미지/파일 전송, 읽음 확인, 푸시 알림 등 고급 기능은 대시보드의 연동 가이드 참조
  • 가격 플랜에서 프로젝트에 맞는 플랜 선택