Ionic + Firebase-推送通知 [英] Ionic + Firebase - Push notifications

问题描述

我有一个ionic + firebase聊天应用程序，我想在收到新消息时向用户发送通知.

I have a ionic + firebase chat app and I'd like to send a notification to a user when a new message is received.

在爱奥尼亚官方文档中，为此推荐的插件为: https://github.com/katzer/cordova-plugin-local-notifications

In the Ionic oficial documentation, the recommended plugin for this is: https://github.com/katzer/cordova-plugin-local-notifications

但是，正如您在存储库中看到的那样，该存储库自上次2月以来尚未进行更新，并且基于其内部的注释，似乎它不适用于最新的Android OS版本.

But as you can see inside the repository, it hasnt been updated since last february and based in comments inside it, it seems like it doesnt work with last Android OS versions.

有人知道替代品吗?

谢谢！

推荐答案

上个月，我在应用程序中实现推送通知时遇到了同样的问题.这是执行此操作的最佳指南: https://medium.com/@senning/push-notifications-with-ionic-and-cordova-plugin-firebase-ab0c0cad3cc0

I had the same problem to implement push notifications in my app last month. This is the best tutorial to do that: https://medium.com/@senning/push-notifications-with-ionic-and-cordova-plugin-firebase-ab0c0cad3cc0

我已将本教程自定义为文件: messaging.service.ts

I customized this tutorial to a file: messaging.service.ts

import {Injectable} from '@angular/core';
import {ApiService} from './api.service';
import {AppApiResponse} from '../interfaces/interfaces'
import {Firebase} from "@ionic-native/firebase";
import {Platform} from "ionic-angular";
import {AngularFirestore} from "@angular/fire/firestore";

@Injectable()
export class MessagingService {

  private userUid: string;

  constructor(private firebase: Firebase,
              public afs: AngularFirestore,
              public platform: Platform) {
  }

  initializeFirebase(userUid) {
    this.userUid = userUid;
    if (!this.platform.is("core")) {
      this.firebase.subscribe("all");
      this.platform.is('android') ? this.initializeFirebaseAndroid() : this.initializeFirebaseIOS();
    }
  }

  initializeFirebaseAndroid() {
    this.firebase.getToken().then(token => {
      this.saveTokenToFirestore(token);
      console.log('token android= ' + JSON.stringify(token));
    });
    this.firebase.onTokenRefresh().subscribe(token => {
      this.saveTokenToFirestore(token);
      console.log('token refresh android= ' + JSON.stringify(token));
    });
    this.subscribeToPushNotifications();
  }

  initializeFirebaseIOS() {
    this.firebase.grantPermission()
      .then(() => {
        this.firebase.getToken().then(token => {
          this.saveTokenToFirestore(token);
          console.log('token ios= ' + JSON.stringify(token));
        });
        this.firebase.onTokenRefresh().subscribe(token => {
          this.saveTokenToFirestore(token);
          console.log('token refresh ios= ' + JSON.stringify(token));
        });
        this.subscribeToPushNotifications();
      })
      .catch((error) => {
        this.firebase.logError('push erro ios= ' + error);
      });
  }

  subscribeToPushNotifications() {
    this.firebase.onNotificationOpen().subscribe((response) => {
      console.log('response push= ' + JSON.stringify(response));
      if (response.tap) {
        //Received while app in background (this should be the callback when a system notification is tapped)
        //This is empty for our app since we just needed the notification to open the app
      } else {
        //received while app in foreground (show a toast)
      }
    });
  }

  private saveTokenToFirestore(token) {
    if (!token) return;

    const devicesRef = this.afs.collection('devices');

    const docData = {
      token,
      userId: this.userUid,
    };

    return devicesRef.doc(token).set(docData)
  }
}

要在代码中使用，只需将其包含在构造函数中:

To use in your code is just include to page constructor:

public msgService: MessagingService

并使用:

try {
    this.msgService.initializeFirebase(user.uid);
} catch (error) {
    console.log('fire push erro= ' + error);
}

这篇关于Ionic + Firebase-推送通知的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！