我们有一个反应原生应用程序,它通过 FCM 运行其通知,具有以下环境:
react-native: 0.59.10,
react-native-firebase: 5.5.6
所有配置都已设置,证书已配置等。直到现在,通知一直像时钟一样工作,但最近我们停止在前台接收通知。
这是NotificationsManager
代码:
import firebase from 'react-native-firebase';
const CHANNEL = 'default';
...
const localNotificationListener = React.useRef();
const notificationOpenListener = React.useRef();
const onTokenRefreshListener = React.useRef();
const receiveForegroundPN = (n) => {
const notification = new firebase.notifications.Notification()
.setNotificationId(n.notificationId)
.setTitle(n.title)
.setSubtitle(n.subtitle)
.setBody(n.body)
.setData(n.data);
if (Platform.OS === 'android') {
notification
.android.setChannelId(CHANNEL)
.android.setSmallIcon('ic_launcher');
}
firebase.notifications().displayNotification(notification);
};
React.useEffect(() => {
const channel = new firebase.notifications.Android.Channel(
CHANNEL,
'Bank Notifications',
firebase.notifications.Android.Importance.Max,
).setDescription('*****');
firebase.notifications().android.createChannel(channel);
localNotificationListener.current = firebase.notifications().onNotification(receiveForegroundPN);
notificationOpenListener.current = firebase.notifications().onNotificationOpened(openNotification);
onTokenRefreshListener.current = firebase.messaging().onTokenRefresh((fcmToken) => {
registerToken({
device_token: fcmToken,
});
});
runFlow();
return () => {
localNotificationListener.current();
notificationOpenListener.current();
onTokenRefreshListener.current();
};
}, []);
当应用在后台运行时,通知在两个平台上都可以正常工作,但当应用处于前台时永远不会显示。
我试过设置show_on_foreground: "true"
,但这没有帮助。实际上,我尝试在receiveForegroundPN
方法中记录任何内容,但它从未被调用,即当应用程序运行时,看起来永远不会从 Firebase 收到通知。
这里可能有什么问题以及使通知正常工作的可能解决方案?
更新
突然之间,在发布此消息的一小时内,iOS开始收到前台通知。Android仍然无法正常工作,但它曾经工作过。
我也遇到了类似的问题.. , onNotification 方法没有得到三重奏,所以我尝试了 onMessage 方法,它似乎适用于前台。
firebase.messages().onMessage(msg => {
// ... your code here
});
迭代 Amr 的答案。
根据文档,您必须挂接到 Firebase 的回调,以便在前台收到推送通知时收到通知。 从那时起,您可以决定如何处理消息。
- 最简单的方法是显示警报
Alert.alert('A new FCM message arrived!', JSON.stringify(remoteMessage));
或 - 您可以使用其他库来显示本地通知。下面是使用
react-native-notifications
库的示例:
// Just call the hook in some root component that's always present
export const useDisplayRemoteNotifications: () => void = () => {
useEffect(() => {
return messaging().onMessage(async remoteMessage => {
Notifications.postLocalNotification({
title: remoteMessage.notification?.title || '',
body: remoteMessage.notification?.body || '',
fireDate: dayjs().add(1, 'second').toDate(), // one second later
});
});
}, []);
};