-
Notifications
You must be signed in to change notification settings - Fork 255
Closed as not planned
Closed as not planned
Copy link
Labels
Description
I am implementing foreground services in react native app using react-native-notifee, I used firebase push notification to send remote notification. my
messaging().setBackgroundMessageHandler((message=>{ console.log("setBackgroundMessageHandler=>", message)
}));
call only when I send notification payload with data and notification
due to this I am getting 2 notification when app is active, and 1 when I didn’t send notification in payload but in that condition setBackgroundMessageHandler not trigger
Please give me possible solution to done foreground services using firebase
My project Info
"react": "18.2.0",
"react-native": "^0.74.0"
"@notifee/react-native": "^9.1.3",
"@react-native-firebase/app": "^19.2.2",
"@react-native-firebase/messaging": "^19.1.2"
My index.js
import 'react-native-gesture-handler';
import { AppRegistry } from 'react-native';
import App from './App';
import { name as appName } from './app.json';
import notifee, { EventType } from '@notifee/react-native';
import messaging from '@react-native-firebase/messaging';
import { onMessageReceived } from './Helper/Notifications';
try {
// Register Foreground Service
notifee.registerForegroundService(async () => {
return new Promise((resolve) => {
notifee.onForegroundEvent(async ({ type, detail }) => {
if (type === EventType.ACTION_PRESS && detail.pressAction.id === 'stop') {
await notifee.stopForegroundService();
resolve();
}
});
});
});
// Background Event Handler
notifee.onBackgroundEvent(async ({ type, detail }) => {
console.log('Background event:', type, detail);
if (type === EventType.ACTION_PRESS) {
switch (detail.pressAction.id) {
case 'stop':
await notifee.stopForegroundService();
break;
}
}
});
messaging().onMessage(onMessageReceived);
messaging().setBackgroundMessageHandler((message=>{
console.log("setBackgroundMessageHandler=>", message)
onMessageReceived(message)
}));
} catch (error) {
console.log("error setBackgroundMessageHandler=>", error)
}
// Register App Component
AppRegistry.registerComponent(appName, () => App);
and my onMessageReceived
async function onMessageReceived(remoteMessage:any) {
Platform.OS=='ios' && await notifee.requestPermission();
// Create a channel for android
const channelId = await notifee.createChannel({
id: 'default-channel',
name: 'Default Notifications',
importance: AndroidImportance.HIGH,
vibration: true,
vibrationPattern: [1000, 750, 3000, 750, 3000, 750, 3000, 750, 3000, 750],
visibility: AndroidVisibility.PUBLIC,
bypassDnd: true,
});
// Access custom data
const { title, body } = remoteMessage.data;
// Display a notification using notifee
await notifee.displayNotification({
title: title || 'Notification',
body: body || 'No additional information available',
android: {
channelId,
importance: AndroidImportance.HIGH,
smallIcon: 'ic_notification',
badgeIconType: AndroidBadgeIconType.SMALL,
visibility: AndroidVisibility.PUBLIC,
actions: [
{
title: '<b>Stop</b>',
pressAction: { id: 'stop' },
},
],
},
});
console.log('DisplayNotificationData is worked!');
}
And my notification payload is
{
"message":{
"data":{
"title": "Styled Title 🤯",
"body": "Styled body message 🎉"
},
"android": {
"priority": "high"
},
"apns": {
"payload": {
"aps": {
"contentAvailable": true,
"sound": "default"
}
}
},
"token":"cCLJ3uvXRCK2pzPQ65_n5E:APA91bEXx71vzuE_vE83fhUQcnaxsjQ-QpzZE7xOihQ_RzxPUOk_EgDsfCofXJGqZ6eqky5XadjGYDLFbi6rrN4Q-p3nRNnVZDZ0l_PvCZ74eEyCL4ZZAwE"
}}