[Flutter] FCM, Firebase Cloud Messagin 연동

2022년 1월 16일에 작성됨

Flutter 앱에 Firebase 추가

Firebase는 기본적으로 세팅이 완료된 상태에서 진행하셔야 합니다. 아직 세팅을 안 하셨다면 Flutter 앱에 Firebase 추가 문서를 보고 완료해 주시거나, 어려우시면 Firebase Android, IOS 연동을 참고하셔서 Firebase 세팅을 완료해 주세요.

사용한 라이브러리

firebase_messaging: ^11.2.5

flutter_local_notifications: ^9.2.0

Android 세팅

android / app / src / main / AndroidManifest.xml

<manifest
    ...
    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
    <uses-permission android:name="android.permission.VIBRATE" />
    <uses-permission android:name="android.permission.WAKE_LOCK" />
    <uses-permission android:name="android.permission.USE_FULL_SCREEN_INTENT" />     
<application
	...
    <meta-data
            android:name="com.google.firebase.messaging.default_notification_channel_id"
            android:value="high_importance_channel" />
<activity
    android:name=".MainActivity"
    ...
    
    android:showWhenLocked="true"
    android:turnScreenOn="true"
    
    <intent-filter>
        <action android:name="FLUTTER_NOTIFICATION_CLICK" />
        <category android:name="android.intent.category.DEFAULT" />
    </intent-filter>
    
    >

 

 

android / app / build.gradle

dependencies {
    implementation platform('com.google.firebase:firebase-bom:29.0.2')
    implementation 'com.google.firebase:firebase-analytics'
}

 

 

android / build.gradle

dependencies {
        classpath 'com.android.tools.build:gradle:4.1.0'
        classpath 'com.google.gms:google-services:4.3.10'
    }

iOS - APNs 세팅

 

iOS에서 FCM을 이용하기 위해서는 인증서 또는 인증키를 발급해야지 사용할 수 있습니다.
firebase에서도 최신 방식인 인증키를 사용하여 구성하는 것이 좋다고 하니 인증키를 이용하여 구성해 볼게요.
(조금 더 알아보니 인증서는 매년 갱신해야 하고 인증키는 따로 갱신 안 해도 된다고 함.)

 

참고로 인증서, 인증키 두 개 다 등록하면 이런 알림이 뜹니다.

 

apple developer에 들어가서 Keys + 버튼 클릭

 

이름 작성해 주고, APNs 체크

 

키를 다운로드합니다.

한번 다운로드하면 다시 다운로드할 수 없다고 하니 안전한 곳에 잘 보관해 줍시다.

 

다운로드한 키를 firebase - 프로젝트 설정 - 클라우드 메시징 - apple 앱 구성에 등록

 

프로젝트 xcode 를 실행시켜 주고, Signing & Capabilities - Capability을 눌러 Push Notifications, Background Modes를 추가

 

 

자세한 건 공식 문서 를 참고해 주세요.

코드

실행에 앞서 firebase_messaging 공식문서를 통해 몇 가지 알아야 할 정보가 있습니다.

1. ios 시뮬레이터에서는 작동하지 않으며 실기기가 필요하다.

2. 애플리케이션이 foreground에 있는 경우 Firebase Android SDK는 설정된 알림 채널에 관계없이 FCM 알림 표시를 차단한다고 한다. 따라서 foreground 메시지를 처리하려면 onMessage로 들어오는 메시지를 처리하고 flutter_local_notifications으로 로컬 알림을 만들 수 있다.

3. background 메시지 관련 함수는 익명 함수가 아니어야 하고, 최상위에 위치하여야 한다.
( Cloud Messaging, Notifications 공식 문서 참고 )

 

저는 Android, ios 둘 다 실기기로 테스트 진행했습니다.

Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
  print('Handling a background message ${message.messageId}');
}

late AndroidNotificationChannel channel;
late FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  FirebaseMessaging.onBackgroundMessage(_firebaseMessagingBackgroundHandler);

  channel = const AndroidNotificationChannel(
    'high_importance_channel', // id
    'High Importance Notifications', // title
    description:
        'This channel is used for important notifications.', // description
    importance: Importance.high,
  );
  
  var initialzationSettingsAndroid =
      AndroidInitializationSettings('@mipmap/ic_launcher');

  var initialzationSettingsIOS = IOSInitializationSettings(
    requestSoundPermission: true,
    requestBadgePermission: true,
    requestAlertPermission: true,
  );

  flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();

  await flutterLocalNotificationsPlugin
      .resolvePlatformSpecificImplementation<
          AndroidFlutterLocalNotificationsPlugin>()
      ?.createNotificationChannel(channel);
      
  var initializationSettings = InitializationSettings(
      android: initialzationSettingsAndroid, iOS: initialzationSettingsIOS);

  await flutterLocalNotificationsPlugin.initialize(
    initializationSettings,
  );

  await FirebaseMessaging.instance.setForegroundNotificationPresentationOptions(
    alert: true,
    badge: true,
    sound: true,
  );
  runApp(const MyApp());
}

class ...
   @override
    void initState() {
      FirebaseMessaging.onMessage.listen((RemoteMessage message) async {
        RemoteNotification? notification = message.notification;
        AndroidNotification? android = message.notification?.android;
        var androidNotiDetails = AndroidNotificationDetails(
          channel.id,
          channel.name,
          channelDescription: channel.description,
        );
        var iOSNotiDetails = const IOSNotificationDetails();
        var details =
            NotificationDetails(android: androidNotiDetails, iOS: iOSNotiDetails);
        if (notification != null) {
          flutterLocalNotificationsPlugin.show(
            notification.hashCode,
            notification.title,
            notification.body,
            details,
          );
        }
      });

      FirebaseMessaging.onMessageOpenedApp.listen((message) {
        print(message);
      });
      super.initState();
    }

 

코드는 공식 문서 Example 참고하였습니다.

Firebase console에서 메시지 보내기

특정기기로 메시지를 보내려면 서버가 기기의 FCM 토큰값을 알아야 합니다.

token = await FirebaseMessaging.instance.getToken();

print("token : ${token ?? 'token NULL!'}");

 

토큰값을 알았다면 Cloud Messaging - 새 알림 - 테스트 메시지 전송을 눌러줍시다.

 

토큰값을 등록해 주고 테스트 버튼을 누르면 정상적으로 메시지가 오는 것을 확인할 수 있습니다.