안녕하세요, 어학 학습 매칭 앱 "CROSSER"의 개발자입니다.
이 「CROSSER」입니다만, Flutter와 Firebase를 이용해 개발하고 있습니다.
이번에는 CROSSER의 푸시 알림 기능을 어떻게 개발했는지 쓰겠습니다. 꼭 참고하십시오!

소개

어학 매칭 앱 「CROSSER」의 개요에 대해서는 이쪽을 참조해 주세요!

이번에 쓰는 것

이와 같이 앱이 백그라운드에 있을 때 Firebase Cloud Message를 사용하여 실시간으로 푸시 알림을 실시하는 방법을 소개하고 싶습니다!

사용하는 것

firebase_messaging
htps // 푸 b. v / Pac 가게 s / 푹신 푹신하다 _ 메사 긴 g

구현 흐름

① Android, iOS 푸시 알림 설정 (정의 파일 설정)
②Android, iOS 앱 측에서 푸시 통지 허가 표시하는 처리
③device token을 취득 처리(이 device token은 테스트 시에 사용합니다.)
④ Firebase Cloud Message로부터 통지를 수신했을 때의 처리

구현 세부 사항 (6/22 추가)

firebase의 setup은 끝난 전제로 기재해 갑니다.

1. 배경 알림 설정

■ 안드로이드

/android/app/build.gradle dependencies에 implementation "com.google.firebase:firebase-messaging:XX.X.X를 추가합니다.

※XX.X.X는 최신 ver.를 써 주세요. 최신 버전은 여기에서 확인할 수 있습니다
htps : // 푹 빠져라. 오, ぇ. 코 m/도 cs/안 d로이 d/세츠 p? hl = 그럼

dependencies {
    ・
    ・
    ・
    // add
    implementation platform('com.google.firebase:firebase-bom:28.0.1')
    // add
    implementation 'com.google.firebase:firebase-messaging:21.0.1'
}

2.app/build.gradle의 minSdkVersion 변경
/android/app/build.gradle의 minSdkVersion을 23으로 설정합니다.

defaultConfig {
        // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
        applicationId "com.example.flutter_fcm_push_notify"
        minSdkVersion 23 // 16 -> 23
        targetSdkVersion 29
        versionCode flutterVersionCode.toInteger()
        versionName flutterVersionName
    }

3.Application.kt 만들기
android/app/src/main/kotlin/<앱의 패키지 이름> 아래에 새로 Application.kt를 만들고 Android 기기에서 앱이 백그라운드에 있을 때 푸시 알림이 표시되도록 설정.

package com.example.yourapp
import io.flutter.app.FlutterApplication
import io.flutter.plugin.common.PluginRegistry
import io.flutter.plugin.common.PluginRegistry.PluginRegistrantCallback
import io.flutter.plugins.firebase.messaging.FlutterFirebaseMessagingBackgroundService
import io.flutter.plugins.firebase.messaging.FlutterFirebaseMessagingPlugin
class Application : FlutterApplication(), PluginRegistrantCallback {
    override fun onCreate() {
        super.onCreate()     
   FlutterFirebaseMessagingBackgroundService.setPluginRegistrant(this)
    }
override fun registerWith(registry: PluginRegistry?) {
        val key: String? = FlutterFirebaseMessagingPlugin::class.java.canonicalName
        if (!registry?.hasPlugin(key)!!) {
            FlutterFirebaseMessagingPlugin.registerWith(registry?.registrarFor("io.flutter.plugins.firebase.messaging.FlutterFirebaseMessagingPlugin"));
        }
    }
}

4. AndroidManifest.xml에 FLUTTER_NOTIFICATION_CLICK 추가
/android/app/src/main/AndroidManifest.xml에 FLUTTER_NOTIFICATION_CLICK 추가

          <intent-filter>
                <action android:name="FLUTTER_NOTIFICATION_CLICK" />
                <category android:name="android.intent.category.DEFAULT" />
            </intent-filter>

■iOS

1. Apple Developer Console에서 APNs Key 만들기
Apple Developer Console의 Certificates, Identifiers & Profiles로 이동하여 왼쪽 메뉴 Keys에서 Key 목록 화면을 열고 + 버튼을 클릭하여 Key 생성 화면을 엽니다.

테스트 방법

Firebase -> Cloud Message로 이동하면 이 화면이 표시됩니다.
이 화면의 '테스트 메시지 보내기' 버튼을 누르고 device token을 입력한 후 '테스트' 버튼을 누르면 실시간으로 푸시 알림을 확인할 수 있습니다.

요약

앱이 백그라운드에 있을 때 실시간 푸시 알림에는 Firebase Cloud Message가 사용하면 좋다!

메세지 기능등이 어플리에 있어, 수신자에게 리얼타임 푸시 통지를 하고 싶은 경우는, 수신자측의 device token이 필요하므로, DB등에 device token을 보관 유지할 필요가 있다.

어플리가 포그라운드에 있을 때는 리얼타임 푸시 통지는 표시되지 않기 때문에, 만약, 포그라운드에서도 푸시 통지를 표시하고 싶은 경우는 FCM로부터 통지가 왔을 때에 다이얼로그를 표시하도록 하면 좋다고 생각한다. (iPhone으로 말하면 통지 센터에는 통지가 온다.)

어학 매칭 앱 "CROSSER"도 잘 부탁드립니다.
평가도 받을 수 있으면 기쁩니다!
iOS/Android 모바일 지원
h tps // // s s 때때로. c / c 로세 r