[flutter] 플러터(Flutter)에서 메시지 푸시 알림 기능 구현하기

플러터(Flutter)는 Google에서 개발한 크로스 플랫폼 앱 개발 프레임워크로, 하나의 코드로 안드로이드 및 iOS 앱을 개발할 수 있습니다. 이번에는 플러터에서 메시지 푸시 알림 기능을 구현하는 방법에 대해 설명하고자 합니다.

1. Firebase 설정

메시지 푸시 알림을 구현하기 위해서는 Firebase 프로젝트를 생성하고 해당 프로젝트를 플러터 앱과 연결해야 합니다.

  1. Firebase 콘솔(https://console.firebase.google.com/)에 접속하여 프로젝트를 생성합니다.
  2. Firebase 프로젝트 설정으로 이동하여 프로젝트 설정 탭을 선택합니다.
  3. 클라우드 메시징 섹션에서 서버 키를 생성합니다.
  4. 생성된 서버 키 값을 복사하여 플러터 앱에서 사용할 준비를 완료합니다.

2. 플러터 앱에서 Firebase 알림 패키지 추가

메시지 푸시 알림을 플러터 앱에 구현하기 위해서는 Firebase 알림 패키지를 추가해야 합니다.

pubspec.yaml 파일에 아래의 의존성을 추가합니다:

dependencies:
  firebase_messaging: ^10.0.0

의존성을 추가한 후, flutter pub get 명령어를 실행하여 패키지를 설치합니다.

3. 메시지 푸시 알림 수신 처리

메시지 푸시 알림을 수신하고 처리하기 위해 main.dart 파일을 열고 아래의 코드를 추가합니다.

import 'package:firebase_messaging/firebase_messaging.dart';

void main() async {
  // 푸시 알림 수신을 처리하기 위한 설정
  await FirebaseMessaging.instance.setForegroundNotificationPresentationOptions(
    alert: true,
    badge: true,
    sound: true,
  );

  // 앱 실행
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 푸시 알림 수신 이벤트 처리
    FirebaseMessaging.onMessage.listen((RemoteMessage message) {
      // 메시지를 수신할 때 동작할 내용을 구현
      print('푸시 알림 수신: ${message.notification?.title}');
      // 푸시 알림을 사용자에게 표시
      showDialog(
        context: context,
        builder: (BuildContext context) => AlertDialog(
          title: Text('새로운 메시지'),
          content: Text(message.notification?.title ?? ''),
          actions: [
            TextButton(
              onPressed: () => Navigator.of(context).pop(),
              child: Text('닫기'),
            ),
          ],
        ),
      );
    });

    return MaterialApp(
      title: 'Flutter Push Notification',
      home: Container(), // 앱의 메인 화면으로 사용할 위젯 설정
    );
  }
}

위의 코드는 FirebaseMessaging을 사용하여 푸시 알림 수신을 처리하는 기본적인 코드입니다. 알림을 받으면 onMessage 이벤트가 발생하고, 해당 이벤트를 수신하면 알림을 사용자에게 표시하는 내용이 구현되어 있습니다.

4. 서버에서 메시지 푸시 알림 전송

메시지 푸시 알림을 구현하기 위한 마지막 단계는 서버에서 알림을 전송하는 것입니다. 이를 위해 Firebase 서버 키를 사용하여 알림을 전송하는 코드를 서버에 구현해야 합니다.

서버에서 알림을 전송하는 방법에 대한 자세한 내용은 Firebase 공식 문서를 참조하시면 됩니다.

마무리

이렇게 플러터(Flutter)에서 메시지 푸시 알림 기능을 구현하는 방법에 대해 알아보았습니다. Firebase를 통해 알림을 전송하고, 플러터 앱에서 수신하여 사용자에게 표시하는 기능을 구현할 수 있습니다. Firebase 서버 키를 안전하게 관리하고, 알림 전송을 위한 서버 코드를 구현하는 것이 중요합니다.

더 자세한 내용은 Firebase 공식 문서를 참조하시면 도움이 될 것입니다.