如何在Angular 7中使用FCM令牌?

时间:2019-03-29 05:53:26

标签: angular firebase firebase-cloud-messaging web-push

我已经在Angular项目中使用了AngularFire,并且想了解FCM令牌。我每次在Chrome浏览器中都获得相同的令牌。我如何存储在数据库中。每次需要时间来加载页面。 所以,请帮帮我。 这是我的示例代码。

messaging.service.ts

import { Injectable } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/auth';
import { AngularFireDatabase } from '@angular/fire/database';
import { AngularFireMessaging } from '@angular/fire/messaging';
import { BehaviorSubject } from 'rxjs';

@Injectable()
export class MessagingService {

  currentMessage = new BehaviorSubject(null);

  constructor(
    private angularFireDB: AngularFireDatabase,
    private angularFireAuth: AngularFireAuth,
    private angularFireMessaging: AngularFireMessaging) {
    this.angularFireMessaging.messaging.subscribe(
      (_messaging) => {
        _messaging.onMessage = _messaging.onMessage.bind(_messaging);
        _messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
      }
    )
  }

  /**
   * request permission for notification from firebase cloud messaging
   * 
   * @param userId userId
   */
  requestPermission(userId) {
    return this.angularFireMessaging.requestToken;
  }
}

app.component.ts

import { Component, ElementRef } from "@angular/core";
import { scrollToTop } from "@app/util";
import { MatDialog } from "@angular/material/dialog";
import {
  MessagingService
} from "@app/services";
import { SlimLoadingBarService } from "@cime/ngx-slim-loading-bar";
import {
  NavigationCancel,
  Event,
  NavigationEnd,
  NavigationError,
  NavigationStart,
  Router
} from "@angular/router";

@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  title = "FCM Web Push";

  constructor(
    public dialog: MatDialog,
    private messagingService: MessagingService
  ) {
    const userId = new Date().getTime();
    if (!this.storage.getItem("fcmToken")) {
      this.messagingService.requestPermission(userId).subscribe(fcmToken => {
        this.storage.setItem("fcmToken", fcmToken);
      });
    }
  }
}

请帮助。谢谢你。

0 个答案:

没有答案