首页 > 解决方案 > 关于点击重定向的 Ionic 4 firebase 通知不适用于 this.ngZone.run(()

问题描述

当推送通知出现并且应用程序处于后台时,我正在尝试将应用程序重定向到文章。当有人根据收到的数据点击通知时,应用程序有时会重定向到文章,但有时只会重定向到主页。

我调试了代码,发现代码块总是正确运行。即使重定向到主页而不是通知页面,“导航成功”总是在控制台中打印。在通知页面上,我在 ngOnInit 函数中获取文章内容。从 http api 成功获取数据。这意味着页面被调用但由于某种原因没有呈现。我完全空白可能是什么原因。请帮忙。

app.component.ts

  constructor(
    private platform: Platform,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar,
    private authenticationService: AuthenticationService,
    private router: Router,
    private route: ActivatedRoute,
    private storage: Storage,
    private toast: ToastController,
    public alertController: AlertController,   
    private menu: MenuController,
    private fcm: FcmService,
    private ngZone: NgZone,
  ) {
    this.user = {};
    this.initializeApp();
    this.backButtonEvent();
  }

  initializeApp() {
     this.platform.ready().then(() => {
     this.statusBar.styleDefault();
     this.splashScreen.hide();

     if (!navigator.onLine) {
        this.presentAlert('No Internet Connection','Sorry, No internet connectivity detected. Please reconnect and try again.');
     }   

      this.authenticationService.authenticationState.subscribe(state => {
       if (state) {
          this.isLoggedIn = true;
          console.log('App Component IF: '+state);
          this.router.navigate(['home']);
       } 

       if(state == false) {
         console.log('App Component ELSE: '+state);
         this.isLoggedIn = false;
         this.router.navigate(['login']);
        }   
       });  
       this.notificationSetup();
     });
   }

private notificationSetup() {
   this.fcm.getToken();
   this.fcm.onTokenRefresh();
   this.fcm.onNotifications().pipe(tap(msg => console.log(msg))).subscribe(
  (msg) => {
    if(msg.tap) {
      this.ngZone.run(() => this.router.navigate(['notification', { id: msg.id, action: msg.action }])).then(e => {
          if (e) {
            console.log(e);
            console.log("Navigation is successful!");
          } else {
            console.log(e);
            console.log("Navigation has failed!");
          }
        }
      );          
    } else {         
      if (this.platform.is('ios')) {
        this.presentToast(msg.aps.alert);
      } else {
        this.presentToast(msg.body);
      }
    }
  });
 }

通知页面 notification.page.ts

export class NotificationPage implements OnInit {
  id: string;
  action: string;
  title: string;
  excerpt: string;
  content: string;    
  audio_code: string; 
  audio_link: string;
  type: string;
  section_parent: string;  
  section_slug: string;
  section_title: string;
  post: any;

constructor(private router: Router, private route: ActivatedRoute, public api: RestApiService, public loadingController: LoadingController) { }

 ngOnInit() {
    //alert('Test');
    this.title = '';
    this.excerpt = '';     
    this.content = '';
    this.audio_code = '';        
    this.audio_link = '';        
    this.type = '';        
    this.section_parent = '';        
    this.section_slug = '';        
    this.section_title = '';        

    this.id = this.route.snapshot.paramMap.get('id');
    this.action = this.route.snapshot.paramMap.get('action');    
    this.getPost(this.id,this.action);
  }

  async getPost(id: any,action: string) {
    const loading = await this.loadingController.create();
    await loading.present();

    await this.api.getArticleById(id,action)
      .subscribe(res => {
         console.log(res);
         this.title = res.object_title;        
         this.excerpt = res.object_excerpt;
         if(res.type=='video')
           this.content = res.video_link;
         else 
           this.content = res.object_content;
         this.type = res.type;        
         this.audio_code = res.audio_code;
         this.audio_link = res.audio_link;
         this.section_parent = res.section_parent;        
         this.section_slug = res.section_slug;        
         this.section_title = res.section_title;                  
         loading.dismiss();

       }, err => {
         console.log(err);
        loading.dismiss();
      });
  }  

标签: angularfirebaseionic-frameworkpush-notificationionic4

解决方案


推荐阅读