배경

FCM(Firebase Cloud Messaging)과 Firebase Cloud Functions에서 푸시 알림을 보내기 때문에 조금 고전했으므로, 메모적인 감각으로 구현 방법을 남겨 둡니다.

토크 앱에서 메시지를 보낼 때 상대방에게 알림을 보내는 패턴을 예로 들어 보겠습니다. (화면 등은 실장하지 않고 뒷면의 처리만 기재해 갑니다.)

전제 조건

푸시 통지가 도착하는 설정이 되어 있다

그렇지 않은 경우 여기를 참조로 설정해보십시오 (IOS 설정).

Firebase와 앱이 함께 작동합니다.

FCM에서 특정 단말기에 푸시 알림을 보내는 방법

FCM 토큰을 지정하여 푸시 알림 보내기 (이번에는 여기 구현)

주제를 등록하고 푸시 알림 보내기

이번 구현의 흐름

앱 측에서 FCM 토큰을 얻고 Firestore의 Users 컬렉션에 저장 (1 터미널 1FCM 토큰)

메시지를 Firestore로 업데이트 (Field에 User의 문서 ID 저장)

메시지 데이터 생성을 키에 CloudFunctions에서 알림을 보내는 프로세스 구현

구현

1. 앱 측에서 FCM 토큰 획득

이 기사를 참고로 구현했습니다!
※Firebase의 설정등은 하기 기사를 참고로 해 주세요.
htps : // v.ぁsss d. jp / rc c s / f r_fcm_pu sh1 /

라이브러리 설치

pubspec.yaml

dependencies:
   firebase_messaging: ^6.0.16

코드 구현

main.dart

import 'package:firebase_messaging/firebase_messaging.dart';  // ライブラリのインポート

void main() {
  runApp(MyApp());
}

// 省略
class _MyHomePageState extends State<MyHomePage> {

  final FirebaseMessaging _firebaseMessaging = new FirebaseMessaging();

  @override
  void initState() {
    super.initState();
    _firebaseMessaging.requestNotificationPermissions(
        const IosNotificationSettings(sound: true, badge: true, alert: true));
    _firebaseMessaging.onIosSettingsRegistered
        .listen((IosNotificationSettings settings) {
      print("Settings registered: $settings");
    });
    _firebaseMessaging.getToken().then((String token) {
      assert(token != null);
      // tokenの中にFcmTokenが入ってる
      print("Push Messaging token: $token");
      // firestoreへtokenの更新を行う
      // 省略
    });
  }
}

업데이트 내용

다음과 같이 업데이트하도록

2. 메시지를 Firestore로 업데이트

이번에는 간단하기 때문에 (CloudFunctions에서 알림을 보내는 것이 메인) 다음과 같은 데이터가 전송된다고 가정합니다.

3. 메시지 데이터 생성을 키에 CloudFunctions로 알림을 보내는 처리 구현

Cloud Functions의 시작 전까지는 다음 도움말을 참조하세요.
htps : // 푹 빠져라. 오, ぇ. 코 m / 드 cs / 훈 c 치온 s / 게 ts r d? hl = 그럼

이번에는 TypeScript로 구현하고 있습니다.

index.ts

const functions = require('firebase-functions');
const admin = require('firebase-admin');
admin.initializeApp(functions.config().firebase);
export const firestore = admin.firestore();

// プッシュ通知を送る関数
const sendPushNotification = function(token:string,title:string,body:string,badge:string) {

    const payload = {
        notification: {
            title: title,
            body: body,
            badge: badge,
            sound:"default"
        }
    };
    const option = {
        priority: "high"
    };
    // ここで実際に通知を送信している
    admin.messaging().sendToDevice(token,payload,option);
}

// 新規依頼作時
export const createMessage = functions.firestore.document('/message/{message}')
    .onCreate( async (snapshot, context) => {
        // ここにmessageのデータが入っている(senderId,senderName,receiverId,content)
        const message = snapshot.data()
        const receiverRef = firestore.collection("Users").doc(message["receiverId"])
        // 受信者の情報にアクセスする
        receiverRef.get().then(function(doc){
                if (doc.exists === true) {
                    // 受信者の情報を取得(name,fcmToken)
                    const receiver = doc.data()
                    const fcmToken = receiver["fcmToken"]
                    const senderName = message["senderName"]
                    const content = message["content"]
                    // 通知のタイトル
                    const title = `$senderName`
                    // 通知の内容
                    const body = `$content`
                    sendPushNotification(fcmToken,title,body,"1");
                    console.log("newMessage")
                 } else {
                    console.log("notExists")
                }
            })
})

마지막으로

FCM을 사용하면 꽤 쉽게 Push 알림을 구현할 수있었습니다!
지금은 그대로 FCMToken을 Firestore에 보존하고 있지만, 실제로는 서브 콜렉션등으로 보안의 설정해 두는 것이 좋을 것 같다.