Wisetracker Docs
웹사이트블로그콘솔 바로가기도입 문의이용 문의
🧑‍💻 개발자 가이드
🧑‍💻 개발자 가이드
  • 와이즈트래커 개발자 가이드
  • quick start
    • 앱 광고 트래킹을 위한 필수 지식
    • SDK 설정 전 기초 진단
    • SDK 설정 후 체크리스트
      • Android
      • iOS
      • ReactNative
      • Flutter
      • Unity
      • Cordova
      • Cocos2d-x
      • Web
    • SDK 데이터 검증
    • 이벤트 발생 현황
  • SDK 연동
    • Android
      • SDK 삽입
      • 필수 이벤트 설정
      • App Link 설정
      • Android 12 ADID 변경사항
    • iOS
      • SDK 삽입
      • 필수 이벤트 설정
      • App Store '개인정보 세부 사항' 가이드
      • Universal Link 설정
    • HybridApp WebView
      • SDK 삽입
      • 필수 이벤트 설정
    • React Native
      • React Native 플러그인 연동
      • 인앱 분석 API
      • AOS 데이터 검증
      • iOS 데이터 검증
    • Flutter
      • Flutter 플러그인 연동
      • AOS 데이터 검증
      • iOS 데이터 검증
    • Unity
      • Unity 플러그인 연동
      • 인앱 이벤트 API
      • AOS 데이터 검증
      • iOS 데이터 검증
    • Website
      • Javascript SDK Integration
      • 웹사이트 이벤트 분석하기
    • CPC 광고 분석 연동
      • Web-To-App SDK 적용
      • App 으로 이동시키기
  • 앱심사 개인정보 처리 가이드
    • SDK 개인정보 처리 가이드
  • SDK 데이터 검증
    • Android 데이터 검증
    • iOS 데이터 검증
    • 웹사이트 데이터 검증
  • In-App Event
    • 인앱 이벤트 설정
      • 페이지 분석
      • 커스텀 차원(Custom Dimension)
    • 인앱 이벤트 리스트
      • Basic : 공통 이벤트
      • Messaging : 푸시/인앱 메시지
      • e-Commerce : 이커머스
      • Education : 교육
      • Travel : 여행 및 레저
      • Entertainment : 엔터테인먼트
      • Game : 게임
      • Fintech : 금융
      • Mobility : 모빌리티
    • 인앱 이벤트 태깅(Tagging)
  • Google Tag Manager 연동
    • 연동 방법
  • Server-to-Server 연동
    • 연동 방법
    • 연동 이벤트
    • 연동 데이터 요약
  • 푸시메세지 가이드
    • 앱 푸시메시지 연동
      • Android
        • FCM 인증서 설정
        • 대시보드 설정
        • SDK 설치 및 API 적용
        • 푸시 알림 데이터 이용
      • iOS
        • APNS 설정
        • 대시보드 설정
        • SDK 설치 및 API 적용
        • 푸시 알림 데이터 이용
      • React Native
        • 준비 사항 안내
        • Android 기초 설정
        • iOS 기초 설정
        • ReactNative 푸시메세지 설정
      • Flutter
        • 준비 사항 안내
        • Android 기초 설정
        • iOS 기초 설정
        • Flutter 푸시메세지 설정
    • 푸시 알림 데이터 이용
Powered by GitBook
On this page
  • Device Token 수집
  • 푸시메시지 클릭 측정
  • 푸시 수신동의
  • 🎉 축하합니다!

Was this helpful?

  1. 푸시메세지 가이드
  2. 앱 푸시메시지 연동
  3. Flutter

Flutter 푸시메세지 설정

Flutter에서 푸시메세지 토큰 수집 및 수신을 위해 필요한 설정 가이드입니다.

푸시메세지 설정에 대한 예제일 뿐, 앱의 특성이나 상황에 따라 코드 삽입의 위치는 달라질 수 있습니다.

Device Token 수집

알림 권한 허용에 대한 확인 여부를 진행했다면, 사용자의 푸시토큰을 수집해야 합니다.

OS 모두 Firebase messaging 서비스를 기반으로 동작하기 때문에, getToken 호출을 통해 Token을 확인할 수 있습니다. 로그를 통해 수집된 token이 확인된다면, setPushToken 호출을 통해 와이즈트래커 SDK가 토큰을 수집할 수 있도록 코드를 추가 해 주세요.

void main() async {
...
...
...
  // binding initialized check
  WidgetsFlutterBinding.ensureInitialized();       
  print("WiseLog DOT start....");
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );

  if (Platform.isIOS) {
    // 푸시 알림을 처리하기 위한 사용자 권한을 요청
    FirebaseMessaging.instance.requestPermission();
  }
  
  final fcmToken = await FirebaseMessaging.instance.getToken();
  print("WiseLog DOT FCM Token: $fcmToken");
  final fcmTokenString = fcmToken.toString() ?? '';
  print("WiseLog DOT FCM TokenString: $fcmTokenString");
  // 와이즈트래커 SDK가 토큰을 수집합니다.
  DOT.setPushToken(fcmToken.toString());
...
...
...
}

푸시메시지 클릭 측정

앱의 상태는 총 3가지로 나눌 수 있습니다.

  • Foreground 상태 : 앱이 켜져있고, 앱을 사용하고 있는 상태

  • Background : Background는 앱이 꺼져있거나, 홈버튼을 눌러 앱을 빠져나온 경우

  • Terminated : Terminated는 앱이 종료된 상태

앱의 상태에 따라, 발송된 푸시메세지가 도착하여 유저가 메세지를 클릭하는 것을 측정하기 위해서 앱에 진입하는 시점에setPushClick을 호출하는 로직을 작성해야 합니다.

유의 해 주셔야 할점은 앱이 Foreground 상태일때 알림메시지 수신에 대한 구현 방식에 따라서, 유저가 Foreground 상태에서 알림을 받아 , 해당 알림을 클릭한 시점에 setPushClick을 호출해주셔야 한다는 점 입니다.

만약 Foreground 상태일때 알림메세지에 대한 구현부가 없으나, setPushClick 을 호출한다면, 아래의 이미지 처럼 유저가 알림을 클릭하지 않았음에도, 대시보드에서 다이렉트 오픈이 카운팅될 수 있습니다.

와이즈트래커 대시보드에서 푸시메세지 테스트 발송시와 Firebase 콘솔에서 푸시 메세지 테스트 발송시 확인되는 메세지에는 다른점이 있습니다. 와이즈트래커 대시보드에서 메시지 발송시에는'RW_push_payload_WP'객체 확인이 가능하나, Firebase 콘솔에서 메시지 발송 테스트 시에는 RW_push_payload_WP 객체정보는 확인되지 않습니다.

(아래에서 예제 확인 해 주세요)

'RW_push_payload_WP' 객체가 들어있는 정보만 setPushClick을 통해 전달하며, JsonString의 parsing을 통해 Direct오픈 여부등을 체크하기에, 다음과 같이 대시보드에서 발송시에만 setPushClick함수가 호출될 수 있도록 제어 해 주세요.

와이즈트래커 대시보드 발송과 Firebase console 에서 발송되는 메시지 payload 비교
1. 와이즈트래커 대시보드에서 메시지 전송시 수신되는 remoteMessage 원본:  
{
   "data":{
      "RW_push_payload_WP":
      "{\"RW_push_payload_CK\":\"0000\",\"RW_push_payload_SK\":\"00000000\",
         \"RW_push_payload_TT\":\"ios test\",\"RW_push_payload_EXPIRED\":\"1672498800000\",
         \"RW_push_payload_PR\":\"7\",\"RW_push_payload_BD\":\"ios test\"
      }"
   },
   "from":"0000000000000",
   "messageId":"0000000000000000",
   "notification":{
      "body":"ios test",
      "title":"ios test"
   }
}

2. firebase console 발송 테스트시 수신되는 remoteMessage 원본 : 
{
   "data":{},
   "from":"0000000000000",
   "messageId":"0000000000000000",
   "mutableContent":true,
   "notification":{
      "body":"fcm test",
      "title":"fcm test"
   },
   "sentTime":"0000000000"
}

앱 진입시점은 앱마다 다를 수 있으며 아래의 예제는 Main.dart를 진입시점으로 예제가 작성되었습니다.

"void main() async {
 ...
 ...

  // 와이즈트래커 SDK가 토큰을 수집합니다.
  DOT.setPushToken(fcmToken.toString());
...
...
  // Foreground 상태에서 FCM 메시지 수신 핸들러 설정
  FirebaseMessaging.onMessage.listen((RemoteMessage remoteMessage) {
    // 메시지가 수신된 경우, setPushClick 메소드가 해당 메시지가 와이즈트래커 대시보드를 통해서 
    // 보낸 메시지가 맞는지 확인함
    // 와이즈트래커에서 보낸 메시지가 맞을 경우, Direct 오픈 수가 1 올라갑니다.
    print(""WiseLog DOT FCM 메시지를 foreground 상태에서 수신하였습니다."");

    // 와이즈트래커 push payload 확인
    final pushPayload = remoteMessage.data?['RW_push_payload_WP'];
    // 객체가 들어있는 정보만 setPushClick을 통해 전달하며, JsonString의 parsing을 통해 Direct오픈 여부등을 체크.
    if (pushPayload != null) {
      DOT.setPushClick(pushPayload);
    } else {
      print(""WiseLog DOT FCM remotemessage"");
    }
  });

  // Background 상태에서 FCM 메시지 수신하여 앱이 다시 열리는 경우에 대한 핸들러 설정
  FirebaseMessaging.onMessageOpenedApp.listen((RemoteMessage remoteMessage) {
    print(""WiseLog DOT FCM 메시지를 수신하였습니다. (1)"");
    print(""WiseLog DOT FCM ${remoteMessage.notification?.body}"");

    final pushPayload = remoteMessage.data?['RW_push_payload_WP'];
    if (pushPayload != null) {
      DOT.setPushClick(pushPayload);
    }
  });

 // terminated 상태에서 FCM 메시지 수신 핸들러 설정
  final FirebaseMessaging firebaseMessaging = FirebaseMessaging.instance;
  RemoteMessage? initialMessage = await firebaseMessaging.getInitialMessage();
  if (initialMessage != null) {
    final pushPayload = initialMessage.data['RW_push_payload_WP'];
    if (pushPayload != null) {
      // Handle the push payload
      print(""WiseLog DOT FCM 메시지를 terminated 상태에서 수신하였습니다."");
      print(""WiseLog DOT FCM ${initialMessage.notification?.body}"");
      DOT.setPushClick(pushPayload);
    } else {
      print(""WiseLog DOT FCM 메시지를 terminated 상태에서 실패하였습니다."");
      print(""WiseLog DOT FCM ${initialMessage.notification?.body}"");
    }
  }
...
...
}	

푸시 수신동의

푸시발송은 기본 적용에서는 "수신거부"입니다. 아래 링크를 참조하여 화면에서 수신동의/거부를 진행 후 해당 데이터를 "태깅"작업을 통해 남겨주세요.

🎉 축하합니다!

Flutter 앱의 푸시메세지 발송을 위한 모든 준비가 끝났습니다!

푸시메세지 발송 테스트를 통해 메시지 수신이 잘 이루어지는지 체크 해 주세요!

PreviousiOS 기초 설정Next푸시 알림 데이터 이용

Last updated 6 months ago

Was this helpful?

Messaging : 푸시/인앱 메시지 | Wisetracker Docs
마케팅 메시지Wisetracker Docs
푸시메세지 테스트 방법
Logo
Logo