[flutter] Firebase_core를 사용하여 플러터 앱에서 Realtime 알림 구현하기

30 Nov 2023

flutter

Firebase는 구글이 제공하는 개발 플랫폼으로, 실시간 데이터베이스와 알림 기능을 제공하는데 유용하게 사용됩니다. 이번에는 Firebase를 사용하여 플러터 앱에서 실시간 알림을 구현하는 방법에 대해 알아보겠습니다.

Firebase 설정

Firebase 프로젝트를 생성하고, 사용할 앱을 추가합니다.
Firebase SDK를 플러터 프로젝트에 추가합니다. pubspec.yaml 파일에 다음과 같이 의존성을 추가합니다:

dependencies:
  firebase_core: ^1.2.0
  firebase_messaging: ^10.2.0
  firebase_analytics: ^9.2.4

Firebase Console에서 앱에 대한 서비스 계정 키(json 형식)를 다운로드합니다.

Firebase_messaging 패키지 설정

main.dart 파일에 다음과 같이 Firebase_messaging 패키지를 초기화하는 코드를 추가합니다:

import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_messaging/firebase_messaging.dart';

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

  runApp(MyApp());
}

pubspec.yaml 파일에 FCM에 사용되는 아이콘 리소스를 추가합니다. icons 디렉토리에 fcm_icon.png 파일을 추가한 후, 다음과 같이 pubspec.yaml 파일을 수정합니다:

flutter_icons:
  android: "icons/fcm_icon.png"
  ios: true

AndroidManifest.xml 파일에 다음과 같이 permission 및 service를 추가합니다:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.notification_app">
    <uses-permission android:name="android.permission.INTERNET" />
    <application>
        <service
            android:name="com.dexterous.flutterlocalnotifications.FlutterLocalNotificationsPlugin"
            android:exported="false"
            android:permission="android.permission.BIND_JOB_SERVICE"
            android:foregroundServiceType="dataSync" />
    </application>
</manifest>

알림 수신 설정

main.dart 파일에 다음과 같이 Firebase_messaging 패키지에서 알림을 수신하는 코드를 추가합니다:

import 'package:firebase_messaging/firebase_messaging.dart';

FirebaseMessaging _firebaseMessaging = FirebaseMessaging.instance;

void _configureFirebaseMessaging() {
  FirebaseMessaging.onMessage.listen((RemoteMessage message) {
    // 앱이 실행 중일 때 알림을 수신한 경우 처리 로직
  });

  FirebaseMessaging.onBackgroundMessage((RemoteMessage message) {
    // 앱이 백그라운드 상태일 때 알림을 수신한 경우 처리 로직
  });

  FirebaseMessaging.onMessageOpenedApp.listen((RemoteMessage message) {
    // 앱이 종료되어 있을 때 알림을 수신하고 앱을 열었을 경우 처리 로직
  });
}

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  _configureFirebaseMessaging();

  runApp(MyApp());
}

Firebase Console에서 프로젝트의 “클라우드 메시징” 탭에서 알림 테스트를 보낼 수 있습니다.

이제 Firebase를 사용하여 플러터 앱에서 실시간 알림을 구현하는 방법을 알게 되었습니다. Firebase_messaging 패키지를 사용하여 알림을 수신하고 처리하는 코드를 추가하고, Firebase Console에서 알림을 테스트해보세요.

더 많은 Firebase 기능과 세부 설정 정보는 Firebase 공식 문서를 참고하시기 바랍니다.