Flutter SDK

플레어레인을 사용하여 플러터(Flutter) 앱푸시 알림을 가장 쉽게 구현할 수 있습니다. 푸시 토큰 및 구독 관리부터 딥링크 등 클릭 URL 처리까지 코드 1줄에 모든 것이 포함되어 있습니다.
타 푸시 솔루션과 함께 사용할 수 있습니다!
병행 사용을 위해서는 iOS: Swizzling 비활성화﻿ 가이드를 참고하여 몇 가지 작업을 추가해야합니다. 안드로이드는 별도의 추가 작업이 필요하지 않습니다.
실제 연동이 완료된 예시를 참고하실 수 있도록 샘플 코드가 준비되어 있습니다.
1. 사전 준비
﻿플레어레인 관리자 에서 회원가입 후 프로젝트 생성
﻿
2. 인증 값 설정
아래 가이드를 참고하여 플레어레인에 푸시 발송에 필요한 인증 값을 입력합니다.
﻿Android: FCM 인증 정보 설정﻿﻿
﻿iOS: APNS 인증 정보 설정﻿﻿
﻿
3. SDK 설치
터미널에서 프로젝트 루트 디렉토리로 이동한 뒤, 다음 명령어를 입력합니다
Terminal
$ flutter pub add flarelane_flutter:1.8.0
$ flutter pub add flarelane_flutter:1.8.0
﻿
﻿
4. Android 13 지원
유저로부터 푸시 알림 구독을 원활히 받아낼 수 있도록 compileSdkVersion을 최소 33으로 지정해주세요.
android/app/build.gradle
// ...
android {
    compileSdkVersion 33
    // ...
}
// ...
// ...
android {
    compileSdkVersion 33
    // ...
}
// ...
﻿
﻿
5. iOS 프로젝트 설정
5-1. Capability 설정
Target 의 Signing & Capabilites으로 들어와 좌상단의 + Capability > Push Notifications 를 선택하여 추가합니다.
또한 Background Modes 를 선택한 뒤 Remote notifications 를 추가합니다.
﻿
5-2. Service Extension 설정
iOS에서는 이미지 등 미디어 첨부를 위해 Notification Service Extension 생성이 필요합니다.
Xcode 에서 File > New > Target 에서 Notification Service Extension 을 선택합니다.
﻿
Product Name에 적절한 이름을 입력합니다. 본 가이드에서는 FlareLaneNotificationServiceExtension 으로 정의하겠습니다.
Language 는 가능하면 Swift 를 권장합니다.
﻿
Cancel을 클릭하여 별도의 Scheme은 활성화하지 않도록 합니다.
﻿
이후 이번에 만든 Notification Service Extension Target의 Minimum Deployments 버전을 현재 사용 중인 메인 앱 Target의 버전과 동일하게 설정합니다.
﻿
5-3. App Group 설정
본 앱과 Extension 간 데이터 동기화를 위해서는 App Group 설정이 필요합니다.
Target 의 Signing & Capabilites으로 들어와 좌상단의 + Capability > App Groups 를 선택하여 추가합니다.
group.번들ID.flarelane 이라는 이름의 그룹을 추가합니다. 나의 번들ID는 본 앱의 Bundle Identifier와 일치해야 합니다.
﻿
정상적으로 추가 후 해당 App Group을 활성화합니다.
﻿
마찬가지로 이전에 만든 Extension 에서도 동일한 이름의 App Group을 추가하고 활성화합니다.
﻿
다음으로ios 디렉토리 내 Podfile을 열고 다음과 같이 추가합니다.
Podfile
// 파일 최하단의 아래 줄 추가
// 앞서 입력한 Extension의 Product Name을 target 이름으로 설정합니다.
target 'FlareLaneNotificationServiceExtension' do
  pod 'FlareLane', '1.7.1'
end
// 파일 최하단의 아래 줄 추가
// 앞서 입력한 Extension의 Product Name을 target 이름으로 설정합니다.
target 'FlareLaneNotificationServiceExtension' do
  pod 'FlareLane', '1.7.1'
end
﻿
pod install 를 실행하여 SDK 설치를 완료합니다.
다시 Xcode를 실행하여 생성한 Extension 파일을 수정합니다. 자동으로 채워진 코드들을 지우고 플레어레인이 제공하는 클래스를 상속하기만 하면 됩니다.
Swift(NorificationService.swift)
Objective-C(NotificationService.h/.m)

import FlareLane

class NotificationService: FlareLaneNotificationServiceExtension {
}

import FlareLane

class NotificationService: FlareLaneNotificationServiceExtension {
}
﻿
﻿
6. 초기화 코드 작성 
main.dart 파일에서 다음 초기화 코드를 입력합니다. 프로젝트 ID는 콘솔의 [프로젝트] 페이지에서 확인할 수 있습니다.
플레어레인 SDK가 제공하는 함수 리스트는  Mobile SDK Reference﻿ 에서 확인할 수 있습니다.
main.dart
import 'package:flarelane_flutter/flarelane_flutter.dart';

void main() {
  // ensureInitialized() 이후 초기화 코드가 실행되도록 합니다
  WidgetsFlutterBinding.ensureInitialized();
  
  // 다음 초기화 코드 입력
  // 알림 권한 팝업 타이밍을 제어하려면 2번째 파라미터를 false로 설정 후 적절한 시점에 .subscribe() 함수 실행
  FlareLane.shared.initialize("PROJECT_ID", requestPermissionOnLaunch: true);
  
  runApp(...);
}

import 'package:flarelane_flutter/flarelane_flutter.dart';

void main() {
  // ensureInitialized() 이후 초기화 코드가 실행되도록 합니다
  WidgetsFlutterBinding.ensureInitialized();
  
  // 다음 초기화 코드 입력
  // 알림 권한 팝업 타이밍을 제어하려면 2번째 파라미터를 false로 설정 후 적절한 시점에 .subscribe() 함수 실행
  FlareLane.shared.initialize("PROJECT_ID", requestPermissionOnLaunch: true);
  
  runApp(...);
}
﻿
﻿
7. 테스트
여기까지 모두 완료하셨으면 앱 빌드, 실행 시 자동으로 플레어레인 전체 기기 리스트에 추가됩니다.
실제 배포 전, 푸시를 실제 발송하여 기기에 잘 오는지, 푸시 클릭 시 통계에 잘 잡히는지 반드시 직접 확인하시기 바랍니다.
FCM 등 푸시 솔루션을 병행 사용하고 있는 경우 iOS: Swizzling 비활성화﻿를 참고하여 몇 가지 작업을 추가해야합니다.
﻿
8. 유저ID 연동
앱 설치 시 플레어레인에 생성된 기기는 '익명의 기기'이며 고객사가 별도로 관리하는 고유한 유저 ID﻿를 연동함으로써 플레어레인의 기기와 고객사의 유저ID를 매칭할 수 있습니다.
유저ID가 연동되어있으면 많은 이점이 있습니다. 회원과 비회원을 구분할 수 있고, 고객사는 언제든지 유저ID를 기준으로 푸시 알림 발송이 가능하기 때문에 초기 연동시 권장드리고 있습니다.
보통 유저가 회원가입이나 로그인 성공 시, setUserId 함수를 통해 유저ID를 연동합니다. 
Dart(Flutter)
FlareLane.shared.setUserId("USER_ID");
FlareLane.shared.setUserId("USER_ID");
﻿
﻿
(심화) 추가 연동
공통
자동 URL 처리
플레어레인은 기본적으로 푸시 알림 클릭 시 https, 딥링크 등 URL에 대해 자동 처리를 지원하고 있습니다. 만약 별도의 클릭 핸들러 구현이 필요한 경우 URL 자동 처리 비활성화﻿를 참고하세요.
Android
알림 색상 설정
values/strings.xml
<resources>
    <!-- 알림 색상 변경  -->
    <string name="flarelane_notification_accent_color">#BC0000</string>
</resources>
<resources>
    <!-- 알림 색상 변경  -->
    <string name="flarelane_notification_accent_color">#BC0000</string>
</resources>
﻿
알림 채널 설정
﻿Android: 알림 채널 설정﻿ 을 참고하여 우리 서비스에 적합한 안드로이드 알림 채널 설정을 합니다.
알림 아이콘 설정
﻿Android: 알림 아이콘 설정﻿ 을 참고하여 아이콘 애셋 세팅을 합니다.
﻿
기타 리소스
가이드
﻿Mobile SDK Reference﻿﻿
﻿Flutter SDK Release Notes﻿﻿
﻿
가이드
Mobile SDK Reference
Flutter SDK Release Notes
React Native SDK
웹뷰 기반 모바일 앱 브릿지 연동