使用 ionic 和 firebase 云消息点击通知后打开页面

Posted

技术标签:

【中文标题】使用 ionic 和 firebase 云消息点击通知后打开页面【英文标题】:Open a page after click on notification using ionic and firebase cloud messaging 【发布时间】:2018-02-02 13:29:31 【问题描述】:

晚上好。我试图以这样一种方式处理通知点击,当用户点击通知时,我的应用程序的特定页面被打开。 我正在使用 FIREBASE 可以消息和 IONIC 3

这里是app.component.ts文件的代码,里面写了处理通知的代码:

import  Platform, Nav, ToastController  from 'ionic-angular';

import  HomePage  from '../pages/home/home';

import  Component, ViewChild  from '@angular/core';

import  FCM  from '@ionic-native/fcm';

import  Signup  from '../pages/signup/signup';

   @Component(
      templateUrl: 'app.html',
      selector: 'Myappname',
   )
   export class MyApp 

        @ViewChild(Nav) nv: Nav;

        rootPage: any = HomePage;

        constructor(public fcm: FCM, platform: Platform) 

          platform.ready().then(() => 

                  fcm.onNotification().subscribe(data => 

                         if (data.wasTapped) 

                              this.nv.push(Signup);

                          else 

                           console.log("Received in foreground");

                         
                 )
         );
    
          

当移动设备收到通知时,如果用户点击它,则只显示主页,并按照代码中指定的方式将他重定向到注册页面。

有什么帮助吗? 谢谢。

【问题讨论】:

嗨@THE HOLLY SPIRIT我也有一个样本你找到任何解决方案在我的案例中数据挖掘总是显示错误的任何解决方案 Hello @jose 确保在您的有效负载对象中,clickAction 属性设置为 FCM_PLUGIN_ACTIVITY 【参考方案1】:

我终于找到了解决办法。当我使用 Firebase 云功能发送通知时,这里是我用来在用户点击收到的通知时使 onNotification() 工作的代码。

exports.Hello = functions.database.ref('/users/userId').onCreate(event=>

         admin.messaging().sendToTopic('all', 
              data:
                 "key1": value1,
                 "key2": value2
              ,
              notification: 
                  clickAction : "FCM_PLUGIN_ACTIVITY",
                  sound : "default",
                  title : "Notification title",
                  body : "message content"
              
         );

);

所以我们必须将 notification 对象的 clickAction 属性设置为 FCM_PLUGIN_ACTIVITY 以使 onNotification() 方法执行当用户点击通知时。

这是 app.component.ts 的代码示例,其中实现了 onNotification() 方法。

  import  Platform, Nav, ToastController  from 'ionic-angular';

  import  HomePage  from '../pages/home/home';

  import  Component, ViewChild  from '@angular/core';

  import  FCM  from '@ionic-native/fcm';

  import  Signup  from '../pages/signup/signup';

  @Component(
        templateUrl: 'app.html',
        selector: 'Myappname',
  )
  export class MyApp 

    @ViewChild(Nav) nv: Nav;

    rootPage: any = HomePage;

    constructor(public fcm: FCM, platform: Platform) 

      platform.ready().then(() => 

              fcm.onNotification().subscribe(data => 

                     if (data.wasTapped) 

                          this.nv.push(Signup);

                      else 

                       console.log("Received in foreground");

                     
             )
           );
      
           

现在,它工作正常!

【讨论】:

【参考方案2】:

尝试将根页面设置为注册页面,希望它可以工作:

this.nv.setRoot(Signup);

如果这不起作用,请尝试在 fcm.onNotification() 之前添加它

var $this = this;

然后使用 $this 在你的 if 语句中引用 // (wasTapped)

$this.nv.setRoot(Signup);

【讨论】:

你好@Mahesh。我尝试了这两个选项,但它不起作用。 你能不能只删除 rootPage=homepage 的分配,然后在收到通知时检查它是否有效 你能试试这最后一件事吗尝试将 rootPage 设置为 signupPage 里面点击 this.rootPage=signup 和内部构造函数 set rootPage=homepage 并检查你在收到通知主页或 signupPage 后重定向到哪里 如果主页没有错误,我会建议一种解决方案 有什么解决办法,请指导

以上是关于使用 ionic 和 firebase 云消息点击通知后打开页面的主要内容,如果未能解决你的问题,请参考以下文章

使用 Firebase 云消息传递的 Ionic Native Push 崩溃

Firebase 云消息与 Ionic 应用程序

Ionic 2:点击推送通知

IOS Firebase 云消息传递“InvalidApnsCredential”

如何在不点击通知的情况下从通知中获取数据(firebase 云消息传递和本机反应)

如何在 Firebase 云消息传递 (FCM) 中使用深度链接