You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Ionic集成FCM插件:点击推送通知弹窗显示消息问题求助

解决Ionic+FCM点击通知后Alert不弹出的问题

我来帮你搞定这个问题!你遇到的情况很典型:FCM通知在后台被点击后,wasTapped分支的alert没触发,但控制台又没报错,这大概率是Angular的消化循环(digest cycle)没被触发导致的——因为FCM的回调是在Angular上下文之外执行的,框架没法自动识别这个操作,所以alert这类UI操作就“无声无息”地失效了。

核心解决方案:用$timeout强制触发Angular消化循环

你只需要给run块注入$timeout服务,然后把alert相关的代码包裹在$timeout回调里,这样Angular就能检测到这个操作并执行UI更新了。修改后的代码如下:

var app = angular.module('starter', ['ionic'])
app.controller('AppCtrl', function ($scope) { })
app.run(function ($ionicPlatform, $timeout) { // 注入$timeout服务
  $ionicPlatform.ready(function () {
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);
      
      FCMPlugin.getToken(
        function (token) {
          alert('Token: ' + token);
          console.log('Token: ' + token);
        },
        function (err) {
          alert('error retrieving token: ' + err);
          console.log('error retrieving token: ' + err);
        }
      );
      
      FCMPlugin.onNotification(
        function (data) {
          // 把通知处理逻辑包在$timeout里,强制触发Angular消化循环
          $timeout(function() {
            if (data.wasTapped) {
              // 通知在托盘被点击时触发
              alert("Tapped: " + JSON.stringify(data));
            } else {
              // 应用前台收到通知时触发
              alert("Not tapped: " + JSON.stringify(data));
            }
          });
        },
        function (msg) {
          alert('onNotification callback successfully registered: ' + msg);
          console.log('onNotification callback successfully registered: ' + msg);
        },
        function (err) {
          alert('Error registering onNotification callback: ' + err);
          console.log('Error registering onNotification callback: ' + err);
        }
      );
    }
    if (window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

额外排查点(如果上面的方案还没解决)

  • 确认FCM插件已正确加载:在$ionicPlatform.ready里加一句console.log('FCMPlugin loaded:', typeof FCMPlugin !== 'undefined'),确保插件在应用启动时已经初始化完成。
  • 测试场景要正确:wasTapped为true的前提是应用处于后台或完全关闭状态,如果应用在前台,会走else分支,别搞混测试场景哦。
  • 监听应用唤醒事件:如果你的Ionic版本偏旧,可能需要结合$ionicPlatform.on('resume', function(){})来监听应用从后台唤醒的事件,再处理FCM的通知数据,但上面的$timeout方案已经能覆盖绝大多数情况了。

内容的提问来源于stack exchange,提问作者jose

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.15 07:46:41