Flutter sample project demonstrating how to use native ChannelTalk SDK in Flutter apps. (Korean Guide)
This project was created to test how to use ChannelTalk SDK in Flutter. It provides practical implementation examples that Flutter developers can reference before adopting ChannelTalk SDK.
ChannelTalk SDK does not officially support Flutter and is not optimized for Flutter.
This project is not an official support project, so the content may differ from the latest version.
This project is an unofficial integration method that implements bridge code to use native Android/iOS SDK in Flutter. Please conduct thorough testing and verification before using in actual production environments.
channeltalk_sample/
├── lib/
│ ├── constants/
│ │ └── texts.dart # App text constants
│ ├── managers/
│ │ ├── channel_io_manager.dart # Flutter ChannelIO Manager (Singleton)
│ │ └── fcm_manager.dart # Firebase messaging manager (FCM + ChannelTalk integration)
│ ├── viewmodels/
│ │ ├── boot_test_viewmodel.dart # Boot functionality test ViewModel
│ │ ├── event_test_viewmodel.dart # Event handling test ViewModel
│ │ ├── fcm_test_viewmodel.dart # FCM functionality test ViewModel
│ │ └── profile_test_viewmodel.dart # Profile functionality test ViewModel
│ ├── views/
│ │ ├── common/ # Common UI components (8 files)
│ │ ├── pages/ # Main app pages
│ │ ├── test_sections/ # Test functionality sections (4 files)
│ │ └── widgets/ # Custom widgets
│ ├── firebase_options.dart # Firebase configuration (FlutterFire CLI generated)
│ └── main.dart # Sample app implementation (UI + ChannelTalk/FCM testing)
├── android/
│ ├── app/
│ │ ├── build.gradle.kts # Android dependencies (Firebase + ChannelTalk)
│ │ ├── google-services.json # Firebase configuration file
│ │ └── src/main/
│ │ ├── AndroidManifest.xml # Custom FCM service registration
│ │ ├── res/values/strings.xml # FCM channel configuration
│ │ └── kotlin/io/channel/channeltalk_sample/
│ │ ├── MainActivity.kt # Flutter ↔ Android bridge
│ │ ├── ChannelIOManager.kt # Android native logic
│ │ ├── MainApplication.kt # ChannelTalk initialization
│ │ └── ChannelIOFirebaseMessagingService.kt # Custom FCM service
├── ios/
│ ├── Podfile # iOS dependencies (Firebase + ChannelTalk)
│ ├── GoogleService-Info.plist # Firebase configuration file
│ └── Runner/
│ ├── AppDelegate.swift # Flutter ↔ iOS bridge (Firebase + FCM)
│ ├── ChannelIOManager.swift # iOS native logic (ChannelPluginDelegate)
│ └── Info.plist # FCM background mode configuration
├── 📚 Documentation/
│ ├── README.md # This file (multi-language support)
│ └── guide/ # Language-specific guide documents
│ ├── ko/ # Korean guides
│ │ ├── installation.md # SDK Installation Guide
│ │ ├── channel_io_manager_guide.md # ChannelIOManager Usage Guide
│ │ ├── push_notification_guide.md # Push Notification Main Guide
│ │ ├── push_notification_android.md # Android Push Setup Guide
│ │ └── push_notification_ios.md # iOS Push Setup Guide
│ └── en/ # English guides
│ ├── installation.md # SDK Installation Guide
│ ├── channel_io_manager_guide.md # ChannelIOManager Usage Guide
│ ├── push_notification_guide.md # Push Notification Main Guide
│ ├── push_notification_android.md # Android Push Setup Guide
│ └── push_notification_ios.md # iOS Push Setup Guide
└── pubspec.yaml # Flutter packages (firebase_core, firebase_messaging)
- Flutter SDK: 3.0 or higher
- iOS: iOS 15.0 or higher
- Android: API 21 or higher (Android 5.0)
- ChannelTalk Plan: Paid service plan
- Flutter: 3.35.2 (stable channel)
- Dart: 3.9.0
- Firebase Core: 2.32.0
- Firebase Messaging: 14.7.10
- Xcode: 16.3 (Build 16E140)
- Swift: 6.1
- CocoaPods: 1.16.2
- Android Gradle: 8.12
- Android Target SDK: API 35
- Android Compile SDK: API 35
- Android Min SDK: API 21
- Firebase BOM: 33.1.2
- Google Services Plugin: Latest (automatic)
- ChannelTalk Android SDK: 12.13.0
- ChannelTalk iOS SDK: Latest (automatic latest version)
For detailed information on ChannelTalk SDK installation and project setup:
📋 English Installation Guide - Step-by-step installation guide
Firebase FCM integration setup for ChannelTalk push notifications:
📬 English Push Notification Guide - Firebase FCM + ChannelTalk Integration
Detailed guide on using ChannelIOManager in Flutter and code reuse:
⚙️ English ChannelIOManager Guide - Implementation, Usage, Reuse Guide
- 📱 iOS SDK Guide
- 🤖 Android SDK Guide
- 🌐 ChannelTalk Developer Documentation
- 💬 ChannelTalk Support Center
⚠️ Important: Firebase FCM configuration is required to run this sample project. Push notification functionality will not work without proper Firebase setup.
# 1. Clone project
git clone https://github.com/channel-io/channel-flutter-sample
cd channeltalk_sample
# 2. Install Flutter dependencies
flutter pub get
# 3. Install iOS dependencies (when building for iOS)
cd ios && pod install && cd ..
// Set plugin key in lib/main.dart file
await channelIO.boot(
pluginKey: "YOUR_PLUGIN_KEY", // ← Change to actual plugin key
// ... other settings
);
- Create Firebase Project in Firebase Console
- Add Android/iOS apps to the project
- Download configuration files:
google-services.json
→android/app/
GoogleService-Info.plist
→ios/Runner/
- Enable Firebase Cloud Messaging in Firebase Console
- Configure push notification credentials in ChannelTalk Admin
# Run in debug mode
flutter run
# Release build
flutter build apk --release # Android
flutter build ios --release # iOS
We recommend using the sample project code as reference material rather than direct reuse. If you plan to reuse the code, please refer to the content below and modify accordingly.
To use in actual projects, please check the following files.
📁 Flutter
├── lib/managers/channel_io_manager.dart # ChannelTalk SDK Flutter interface (MethodChannel + event management)
├── lib/managers/fcm_manager.dart # Firebase FCM + ChannelTalk integrated manager
└── lib/firebase_options.dart # Firebase configuration (FlutterFire CLI generated)
📁 Android
├── android/app/src/main/kotlin/.../ChannelIOManager.kt # ChannelTalk native logic (ChannelPluginListener)
├── android/app/src/main/kotlin/.../MainActivity.kt # Flutter ↔ Android bridge
├── android/app/src/main/kotlin/.../MainApplication.kt # ChannelTalk initialization
├── android/app/src/main/kotlin/.../ChannelIOFirebaseMessagingService.kt # Custom FCM service
├── android/app/src/main/AndroidManifest.xml # FCM service registration + permissions
└── android/app/src/main/res/values/strings.xml # FCM channel configuration
📁 iOS
├── ios/Runner/ChannelIOManager.swift # ChannelTalk native logic (ChannelPluginDelegate)
├── ios/Runner/AppDelegate.swift # Flutter ↔ iOS bridge (Firebase + FCM + UNUserNotificationCenter)
└── ios/Runner/Info.plist # FCM background mode configuration
📁 Firebase Configuration
├── android/app/google-services.json # Android Firebase configuration
├── ios/GoogleService-Info.plist # iOS Firebase configuration
├── android/app/build.gradle.kts # Android dependencies (Firebase BOM + ChannelTalk)
└── ios/Podfile # iOS dependencies (Firebase + ChannelTalk)
-
Integrated ChannelIOManager Architecture:
- Flutter: Provides unified SDK interface with Singleton pattern
- Android: Real-time event reception with
ChannelPluginListener
implementation - iOS: Real-time event reception with
CHTChannelPluginDelegate
implementation - MethodChannel: Bidirectional communication between platforms (method calls + event callbacks)
-
Platform-optimized FCM Processing:
- Android: Native processing in
ChannelIOFirebaseMessagingService
(inherits FlutterFirebaseMessagingService) - iOS: Integration with Flutter through
UNUserNotificationCenterDelegate
inAppDelegate
- Android: Native processing in
-
Accurate ChannelTalk Message Detection: Distinguished by
data['provider'] == 'Channel.io'
key -
Flutter FCM Compatibility: Completely preserves existing Flutter FCM functionality while adding ChannelTalk message processing
📖 Detailed ChannelIOManager Usage: Check ChannelIOManager Guide for detailed information on implementation structure, usage, and code reuse.
- Package Name Change: Modify package names in files to match your actual project
- Plugin Key Configuration: Use actual key issued by ChannelTalk
- Firebase Configuration: Replace
google-services.json
/GoogleService-Info.plist
files with actual project settings - Permission Settings: Check Android 13+
POST_NOTIFICATIONS
permission and iOS notification permissions ⚠️ Notes for Reusing ChannelIOManager.swift:- We recommend adding the
ChannelIOManager.swift
file directly in Xcode - Copying from file explorer or creating with external editors may not be recognized by iOS project.
- Refer to Apple Developer Documentation for details.
- We recommend adding the
This project was created for learning and reference purposes. If you find improvements or issues, feel free to create Issues or PRs in the project, but contacting through ChannelTalk service will enable faster responses.
This project is used only for learning and testing purposes. ChannelTalk SDK license applies separately.
Flutter 앱에서 네이티브 채널톡 SDK를 사용하는 방법에 대한 샘플 프로젝트입니다.
이 프로젝트는 Flutter에서 채널톡 SDK를 사용하는 방법을 테스트하기 위해 만들어졌습니다. Flutter 개발자들이 채널톡 SDK를 도입하기 전에 참고할 수 있는 실제 구현 예제를 제공합니다.
채널톡 SDK는 Flutter를 공식 지원하지 않고 있으며, Flutter에 최적화 되지 않았습니다.
이 프로젝트는 공식 지원 프로젝트가 아니기 때문에, 최신 버전과 내용이 다를 수 있습니다.
이 프로젝트는 네이티브 Android/iOS SDK를 Flutter에서 사용할 수 있도록 브리지 코드를 구현한 비공식 연동 방법입니다. 실제 프로덕션 환경에서 사용하실 때는 충분한 테스트와 검증을 거치시기 바랍니다.
channeltalk_sample/
├── lib/
│ ├── constants/
│ │ └── texts.dart # 앱 텍스트 상수
│ ├── managers/
│ │ ├── channel_io_manager.dart # Flutter ChannelIO Manager (Singleton)
│ │ └── fcm_manager.dart # Firebase 메시징 매니저 (FCM + 채널톡 연동)
│ ├── viewmodels/
│ │ ├── boot_test_viewmodel.dart # Boot 기능 테스트 ViewModel
│ │ ├── event_test_viewmodel.dart # 이벤트 처리 테스트 ViewModel
│ │ ├── fcm_test_viewmodel.dart # FCM 기능 테스트 ViewModel
│ │ └── profile_test_viewmodel.dart # 프로필 기능 테스트 ViewModel
│ ├── views/
│ │ ├── common/ # 공통 UI 컴포넌트 (8개 파일)
│ │ ├── pages/ # 메인 앱 페이지들
│ │ ├── test_sections/ # 테스트 기능 섹션들 (4개 파일)
│ │ └── widgets/ # 커스텀 위젯들
│ ├── firebase_options.dart # Firebase 설정 파일 (FlutterFire CLI 생성)
│ └── main.dart # 샘플 앱 구현 (UI + 채널톡/FCM 테스트)
├── android/
│ ├── app/
│ │ ├── build.gradle.kts # Android 종속성 설정 (Firebase + 채널톡)
│ │ ├── google-services.json # Firebase 설정 파일
│ │ └── src/main/
│ │ ├── AndroidManifest.xml # 커스텀 FCM 서비스 등록
│ │ ├── res/values/strings.xml # FCM 채널 설정
│ │ └── kotlin/io/channel/channeltalk_sample/
│ │ ├── MainActivity.kt # Flutter ↔ Android 브리지
│ │ ├── ChannelIOManager.kt # Android 네이티브 로직
│ │ ├── MainApplication.kt # 채널톡 초기화
│ │ └── ChannelIOFirebaseMessagingService.kt # 커스텀 FCM 서비스
├── ios/
│ ├── Podfile # iOS 종속성 설정 (Firebase + 채널톡)
│ ├── GoogleService-Info.plist # Firebase 설정 파일
│ └── Runner/
│ ├── AppDelegate.swift # Flutter ↔ iOS 브리지 (Firebase + FCM)
│ ├── ChannelIOManager.swift # iOS 네이티브 로직 (ChannelPluginDelegate)
│ └── Info.plist # FCM 백그라운드 모드 설정
├── 📚 문서들/
│ ├── README.md # 이 파일 (다국어 지원)
│ └── guide/ # 언어별 가이드 문서
│ ├── ko/ # 한국어 가이드
│ │ ├── installation.md # SDK 설치 가이드
│ │ ├── channel_io_manager_guide.md # ChannelIOManager 사용 가이드
│ │ ├── push_notification_guide.md # 푸시 알림 메인 가이드
│ │ ├── push_notification_android.md # Android 푸시 설정 가이드
│ │ └── push_notification_ios.md # iOS 푸시 설정 가이드
│ └── en/ # English guides
│ ├── installation.md # SDK Installation Guide
│ ├── channel_io_manager_guide.md # ChannelIOManager Usage Guide
│ ├── push_notification_guide.md # Push Notification Main Guide
│ ├── push_notification_android.md # Android Push Setup Guide
│ └── push_notification_ios.md # iOS Push Setup Guide
└── pubspec.yaml # Flutter 패키지 (firebase_core, firebase_messaging)
- Flutter SDK: 3.0 이상
- iOS: iOS 15.0 이상
- Android: API 21 이상 (Android 5.0)
- 채널톡 플랜: 유료 서비스 플랜
- Flutter: 3.35.2 (stable channel)
- Dart: 3.9.0
- Firebase Core: 2.32.0
- Firebase Messaging: 14.7.10
- Xcode: 16.3 (Build 16E140)
- Swift: 6.1
- CocoaPods: 1.16.2
- Android Gradle: 8.12
- Android Target SDK: API 35
- Android Compile SDK: API 35
- Android Min SDK: API 21
- Firebase BOM: 33.1.2
- Google Services Plugin: Latest (자동)
- 채널톡 Android SDK: 12.13.0
- 채널톡 iOS SDK: Latest (자동 최신 버전)
채널톡 SDK 설치 및 프로젝트 설정에 대한 자세한 내용:
📋 한국어 설치 가이드 - 단계별 설치 가이드
채널톡 푸시 알림을 위한 Firebase FCM 연동 설정:
📬 한국어 푸시 알림 설정 가이드 - Firebase FCM + 채널톡 연동
Flutter에서 ChannelIOManager를 사용하는 방법과 코드 재사용에 대한 상세 가이드:
⚙️ 한국어 ChannelIOManager 가이드 - 구현 구조, 사용법, 재사용 가이드
- 📱 iOS SDK 가이드
- 🤖 Android SDK 가이드
- 🌐 채널톡 개발자 문서
- 💬 채널톡 지원센터
⚠️ 중요: 이 샘플 프로젝트를 실행하려면 Firebase FCM 설정이 필수입니다. Firebase 설정 없이는 푸시 알림 기능이 동작하지 않습니다.
# 1. 프로젝트 클론
git clone https://github.com/channel-io/channel-flutter-sample
cd channeltalk_sample
# 2. Flutter 종속성 설치
flutter pub get
# 3. iOS 종속성 설치 (iOS 빌드시)
cd ios && pod install && cd ..
// lib/main.dart 파일에서 플러그인 키 설정
await channelIO.boot(
pluginKey: "YOUR_PLUGIN_KEY", // ← 실제 플러그인 키로 변경
// ... 기타 설정
);
- Firebase 프로젝트 생성 (Firebase Console에서)
- Android/iOS 앱 추가
- 설정 파일 다운로드:
google-services.json
→android/app/
GoogleService-Info.plist
→ios/Runner/
- Firebase Cloud Messaging 활성화 (Firebase Console에서)
- 푸시 알림 자격증명 설정 (채널톡 관리자에서)
# Debug 모드 실행
flutter run
# Release 빌드
flutter build apk --release # Android
flutter build ios --release # iOS
샘플 프로젝트의 코드를 재사용하기보다는 참고자료로 사용하시는 것을 권장드립니다. 만약 재사용을 하는 경우, 아래 내용을 참조하여 코드를 수정해주세요.
실제 프로젝트에서 사용하려면 다음 파일들을 확인해주세요.
📁 Flutter
├── lib/managers/channel_io_manager.dart # 채널톡 SDK Flutter 인터페이스 (MethodChannel + 이벤트 관리)
├── lib/managers/fcm_manager.dart # Firebase FCM + 채널톡 통합 관리자
└── lib/firebase_options.dart # Firebase 설정 (FlutterFire CLI 생성)
📁 Android
├── android/app/src/main/kotlin/.../ChannelIOManager.kt # 채널톡 네이티브 로직 (ChannelPluginListener)
├── android/app/src/main/kotlin/.../MainActivity.kt # Flutter ↔ Android 브리지
├── android/app/src/main/kotlin/.../MainApplication.kt # 채널톡 초기화
├── android/app/src/main/kotlin/.../ChannelIOFirebaseMessagingService.kt # 커스텀 FCM 서비스
├── android/app/src/main/AndroidManifest.xml # FCM 서비스 등록 + 권한 설정
└── android/app/src/main/res/values/strings.xml # FCM 채널 설정
📁 iOS
├── ios/Runner/ChannelIOManager.swift # 채널톡 네이티브 로직 (ChannelPluginDelegate)
├── ios/Runner/AppDelegate.swift # Flutter ↔ iOS 브리지 (Firebase + FCM + UNUserNotificationCenter)
└── ios/Runner/Info.plist # FCM 백그라운드 모드 설정
📁 Firebase 설정
├── android/app/google-services.json # Android Firebase 설정
├── ios/GoogleService-Info.plist # iOS Firebase 설정
├── android/app/build.gradle.kts # Android 종속성 (Firebase BOM + 채널톡)
└── ios/Podfile # iOS 종속성 (Firebase + 채널톡)
-
통합된 ChannelIOManager 아키텍처:
- Flutter: Singleton 패턴으로 단일화된 SDK 인터페이스 제공
- Android:
ChannelPluginListener
구현으로 실시간 이벤트 수신 - iOS:
CHTChannelPluginDelegate
구현으로 실시간 이벤트 수신 - MethodChannel: 플랫폼 간 양방향 통신 (메소드 호출 + 이벤트 콜백)
-
플랫폼별 최적화된 FCM 처리:
- Android:
ChannelIOFirebaseMessagingService
(FlutterFirebaseMessagingService 상속)에서 네이티브 처리 - iOS:
AppDelegate
의UNUserNotificationCenterDelegate
에서 Flutter와 연동
- Android:
-
채널톡 메시지 정확한 판별:
data['provider'] == 'Channel.io'
키로 구분 -
Flutter FCM 호환성 유지: 기존 Flutter FCM 기능을 완전히 보존하면서 채널톡 메시지 추가 처리
📖 자세한 ChannelIOManager 사용법: ChannelIOManager 가이드에서 구현 구조, 사용법, 코드 재사용에 대한 상세 정보를 확인하세요.
- 패키지명 변경: 파일 내 패키지명을 실제 프로젝트에 맞게 수정
- 플러그인 키 설정: 채널톡에서 발급받은 실제 키 사용
- Firebase 설정:
google-services.json
/GoogleService-Info.plist
파일을 실제 프로젝트 설정으로 교체 - 권한 설정: Android 13+
POST_NOTIFICATIONS
권한 및 iOS 알림 권한 확인 ⚠️ ChannelIOManager.swift 재사용 시 참고사항:ChannelIOManager.swift
파일은 Xcode에서 직접 추가하는 것을 권장드립니다- 파일 탐색기에서 복사하거나 외부 에디터로 생성하면 iOS 프로젝트에서 인지하지 못할 수 있습니다.
- 자세한 내용은 Apple 개발자 문서를 참고하세요.
이 프로젝트는 학습 및 참고 목적으로 만들어졌습니다. 개선 사항이나 문제점을 발견하시면 프로젝트의 Issue 혹은 PR을 요청해주셔도 좋지만, 채널톡 서비스를 통해 문의를 주시면 빠른 응답이 가능합니다.
이 프로젝트는 학습 및 테스트 목적으로만 사용됩니다. 채널톡 SDK의 라이선스는 별도로 적용됩니다.