[flutter] 플러터에서의 푸시 알림 구현 방법

플러터에서는 Firebase를 사용하여 푸시 알림을 구현할 수 있습니다. Firebase는 클라우드 기반의 백엔드 서비스로, 다양한 기능을 제공하여 플러터 앱에서 푸시 알림을 쉽게 구현할 수 있습니다.

1. Firebase 프로젝트 생성 및 설정

Firebase 콘솔에 접속하여 새 프로젝트를 생성합니다. 생성된 프로젝트에서 ‘Cloud Messaging’을 활성화하고 푸시 알림 구성을 위한 서버 키를 생성합니다.

2. 플러터 앱에 Firebase 연동

pubspec.yaml 파일에 다음과 같이 firebase_messaging 라이브러리를 추가합니다:

dependencies:
  flutter:
    sdk: flutter
  firebase_messaging: ^10.0.0

터미널에서 flutter pub get 명령어를 실행하여 라이브러리를 가져옵니다.

3. FCM 토큰 받기

FirebaseMessaging 인스턴스를 생성하고 FCM 토큰을 받는 코드를 작성합니다:

import 'package:firebase_messaging/firebase_messaging.dart';

class PushNotificationService {
  final FirebaseMessaging _firebaseMessaging = FirebaseMessaging.instance;

  Future<String> getFcmToken() async {
    return await _firebaseMessaging.getToken();
  }
}

4. 앱에 푸시 알림 처리 로직 추가

날짜 푸시 알림을 받으려면 푸시 알림 처리 로직을 추가해야 합니다. 푸시 알림을 처리하는 코드는 앱의 메인 MaterialApp 위젯이나 Widget 상태에서 작성할 수 있습니다. 다음은 푸시 알림을 처리하는 코드의 예입니다:

import 'package:firebase_messaging/firebase_messaging.dart';

class MyAppState extends State<MyApp> {
  final FirebaseMessaging _firebaseMessaging = FirebaseMessaging.instance;

  @override
  void initState() {
    super.initState();
    // 푸시 알림 수신 이벤트 핸들러 등록
    _firebaseMessaging.setForegroundNotificationPresentationOptions(
      alert: true,
      badge: true,
      sound: true,
    );
    FirebaseMessaging.onMessage.listen((message) {
      // 푸시 알림 수신 시 로직 작성
      String title = message.notification?.title ?? '';
      String body = message.notification?.body ?? '';
      // 푸시 알림을 화면에 표시하는 등의 처리
    });
  }

  // ...
}

5. 서버에서 푸시 알림 보내기

Firebase Admin SDK나 Firebase REST API를 사용하여 서버에서 푸시 알림을 보낼 수 있습니다. 푸시 알림 옵션을 설정하고 알림을 수신하는 장치를 선택하는 등의 작업을 수행한 후, 푸시 알림을 보내는 코드를 작성합니다.

예를 들어, Node.js에서 Firebase Admin SDK를 사용하여 푸시 알림을 보내는 코드는 다음과 같습니다:

const admin = require('firebase-admin');

// Firebase Admin SDK를 초기화합니다
admin.initializeApp();

// 알림 페이로드를 작성합니다
const payload = {
  notification: {
    title: '푸시 알림',
    body: '새로운 알림이 도착했습니다'
  }
};

// 푸시 알림을 보냅니다
admin.messaging().sendToDevice('<DEVICE_TOKEN>', payload)
  .then(response => {
    console.log('푸시 알림이 성공적으로 보내졌습니다:', response);
  })
  .catch(error => {
    console.log('푸시 알림 보내기 실패:', error);
  });

위의 코드에서 <DEVICE_TOKEN>은 푸시 알림을 수신하는 장치의 토큰으로 교체해야 합니다.

결론

이제 플러터에서 푸시 알림을 구현하는 방법을 알게 되었습니다. Firebase를 활용하여 푸시 알림 기능을 쉽게 구현할 수 있으니, 앱에 푸시 알림 기능을 추가하여 사용자에게 유용한 정보를 실시간으로 전달해 보세요.