Android Kill-State support for data-only notification

[sametmasaci]

I am trying to get notifications in any app state (foreground, background, killed). First I used notification part in notification json but it led to an issue which is when app is in background the notification is not displayed only appers in tray area. Then I used data part of notification. This time everything is good except when app is killed. I have console.log in my index.js setBackgroundMessageHandler but it is not called when notification is composed of only data part as I said.

**

• The JSON that I sent for the notification is :

**
{"to":"dNcD9IWBRvOeC-HLa24DXz:APA91bFIz0e1Fzkp7pDC_oclOLCeB7nDAp06rjQ4Dbn3j56vg2tyC2gEw04w83tXsQGlJWsPQ9N44T-YPc9zn4F4EnVylHXcxTyd-4khDO70ysEHsqTPPCHwlO6rCOC1_T_VMpdbGICh","data":{"title":"bildtitle","message":"bildbody"},"options":{"importance":"high","priority":"high"}}
Note: This notification arrives to the app when app is in background(when I press home button on Android), or in foreground. But it doesn't arrive when the app is swiped up using third button on the phone. In the Node.js window where I see console.log messages I see index.js for the first message but not the second or the third or the message itself doesnt get console.logged when app is killed by swiping up.

**

• Index.JS File:

**
import { registerRootComponent } from "expo";
import messaging from "@react-native-firebase/messaging";

import App from "./App";
import { localNotificationService } from "./LocalNotificationService";

// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
// It also ensures that whether you load the app in the Expo client or in a native build,
// the environment is set up appropriately

messaging().setBackgroundMessageHandler(async (remoteMessage) => {
// console.log("Message handled in the background!", remoteMessage);
const messageId = remoteMessage.messageId;
const title = remoteMessage.data.title;
const message = remoteMessage.data.message;
// console.log("messageid: ", messageId, "title: ", title, "message: ", message);
localNotificationService.showNotification(0, title, message);
});

registerRootComponent(App);

**

• Package.Json:

**
{
"main": "index.js",
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"@react-native-firebase/app": "^8.4.1",
"@react-native-firebase/messaging": "^7.8.4",
"expo": "~38.0.9",
"expo-secure-store": "~9.0.1",
"expo-splash-screen": "^0.5.0",
"expo-status-bar": "^1.0.0",
"expo-updates": "~0.2.10",
"react": "~16.11.0",
"react-dom": "~16.11.0",
"react-native": "~0.62.2",
"react-native-gesture-handler": "~1.6.1",
"react-native-push-notification": "^5.1.0",
"react-native-reanimated": "~1.9.0",
"react-native-screens": "~2.9.0",
"react-native-unimodules": "~0.10.1",
"react-native-uuid": "^1.4.9",
"react-native-web": "~0.11.7",
"react-native-webview": "9.4.0"
},
"devDependencies": {
"@babel/core": "~7.9.0",
"babel-jest": "~25.2.6",
"jest": "~25.2.6",
"react-test-renderer": "~16.11.0"
},
"jest": {
"preset": "react-native"
},
"private": true
}

**

• App.JS:

**

import { StatusBar } from "expo-status-bar";
import React, { useState, useEffect } from "react";
import { StyleSheet, Text, View, ActivityIndicator } from "react-native";
import { WebView } from "react-native-webview";
import uuid from "uuid/v4";
import * as SecureStore from "expo-secure-store";
import { fcmService } from "./FCMService";
import { localNotificationService } from "./LocalNotificationService";

let cookieguid;

remember = async () => {
try {
await SecureStore.setItemAsync("cookie1", JSON.stringify(cookieguid));
console.log("remembered " + cookieguid);
} catch (e) {
console.log(e);
}
};

export default function App() {
const [cookie, setCookie] = useState("");
const [loading, setLoading] = useState(true);
const [refresh, setRefresh] = useState(false);
const [newKey, setKey] = useState(0);

let webViewRef;

useEffect(() => {
//Get a cookie as soon as App.js loads
getCookie().catch((error) => {});
}, []);

useEffect(() => {
fcmService.registerAppWithFCM();
fcmService.register(onRegister, onNotification, onOpenNotification);
localNotificationService.configure(onOpenNotification);

function onRegister(token) {
  console.log("[App] onRegister: ", token);
}

function onNotification(notify) {
  console.log("[App] onNotification: ", notify);
  const options = {
    soundName: "default",
    playSound: true, //,
    // largeIcon: 'ic_launcher', // add icon large for Android (Link: app/src/main/mipmap)
    // smallIcon: 'ic_launcher' // add icon small for Android (Link: app/src/main/mipmap)
  };
  localNotificationService.showNotification(
    0,
    notify.title,
    notify.body,
    notify,
    options
  );
}

function onOpenNotification(notify) {
  console.log("[App] onOpenNotification: ", notify);
  alert("Open Notification: " + notify.body);
}

return () => {
  console.log("[App] unRegister");
  fcmService.unRegister();
  localNotificationService.unregister();
};

}, []);

getCookie = async () => {
try {
const savedCookie = await SecureStore.getItemAsync("cookie1");
if (savedCookie) {
setCookie(savedCookie);
if (webViewRef) {
webViewRef.reload();
}
} else {
cookieguid = uuid();
setCookie(cookieguid);
if (webViewRef) {
webViewRef.reload();
}
console.log("getCookieguid: " + cookieguid);
}

  setKey(newKey + 1);
  setLoading(false);
} catch (e) {
  console.log(e);
}

};

deleteSavedCookie = async () => {
try {
await SecureStore.deleteItemAsync("cookie1");
console.log(
"delete: " + cookie,
"afterdelete " + (await SecureStore.getItemAsync("cookie1"))
);
} catch (e) {
console.log(e);
}
};

const loadingComp = (
<ActivityIndicator
animating={true}
color='#84888d'
size='large'
hidesWhenStopped={true}
style={{
alignItems: "center",
justifyContent: "center",
padding: 30,
flex: 1,
}}
/>
);
const webviewComp = (
<View style={{ height: "100%", width: "100%" }}>
{cookie}
<WebView
source={{
uri: "http://192.168.1.222:8077/m",
headers: {
Cookie: "cookie1=" + cookie,
},
}}
style={{ marginTop: 30 }}
onMessage={(event) => {
const { data } = event.nativeEvent;
if (data === "True") {
remember();
} else if (data === "Exit") {
deleteSavedCookie().then(() => getCookie());
}
}}
key={newKey}
renderError={(e) => {
//Renders this view while resolving the error
return (
<View
style={{
height: "100%",
width: "100%",
}}
>
<ActivityIndicator
animating={true}
color='#84888d'
size='large'
hidesWhenStopped={true}
style={{
alignItems: "center",
justifyContent: "center",
padding: 30,
flex: 1,
}}
/>

);
}}
onError={(e) => {
let insecureHosts = [-1004, -6, -1202]; //all error codes as displayed on your console
if (e) {
setTimeout(function () {
getCookie();
}, 5000);
}
}}
/>

);

return loading ? loadingComp : webviewComp;
}

const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});

**

• Android/build.gradle

**
buildscript {
...
dependencies {
classpath("com.android.tools.build:gradle:3.5.3")

    classpath 'com.google.gms:google-services:4.3.3'

    // NOTE: Do not place your application dependencies here; they belong
    // in the individual module build.gradle files
}

}

**

• Android/App/Src/Main/AndroidManifest.xml

**

<!-- Change the value to true to enable pop-up for in foreground (remote-only, for local use ignoreInForeground) -->
<meta-data android:name="com.dieam.reactnativepushnotification.notification_foreground" android:value="false"/>
<!-- Change the value to false if you don't want the creation of the default channel -->
<meta-data android:name="com.dieam.reactnativepushnotification.channel_create_default" android:value="true"/>
<!-- Change the resource name to your App's accent color - or any other color you want -->
<meta-data android:name="com.dieam.reactnativepushnotification.notification_color" android:resource="@color/white"/>
<!-- or @android:color/{name} to use a standard color -->

<receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationActions" />
<receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
<receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
  <intent-filter>
    <action android:name="android.intent.action.BOOT_COMPLETED" />
  </intent-filter>
</receiver>

<service android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService" android:exported="false">
  <intent-filter>
    <action android:name="com.google.firebase.MESSAGING_EVENT" />
  </intent-filter>
</service>
<!-- END NOTIFICATION -->
<activity android:name=".MainActivity" android:label="@string/app_name" android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.App.SplashScreen">
  <intent-filter>
    <action android:name="android.intent.action.MAIN"/>
    <category android:name="android.intent.category.LAUNCHER"/>
  </intent-filter>
</activity>
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity"/>

Note: I want to use default channel for the notifications I want to send notifications to specific devies using their token

[mikehardy]

you are using version xyz ? this is on platform ? "killed" how exactly (describe the exact steps) ? The JSON you send via the javascript admin SDK is ?

[sametmasaci]

Thank you I updated my question. In case anything is missing, if you tell I will add it

[sametmasaci]

The problem was android app when in debug when swiped up was getting killed by Android. I didn't know that. I know react concepts, some react-native concepts but don't know much about Android development that mislead me into thinking notifications did not work. When I build apk (release) notifications work as expected.

[mikehardy]

Unfortunately this is vendor dependent as well. If you implement headless support the app may stay alive after being swiped away, on many vendors. If you send a visible notification it will show up even if your app is closed but you won't get to handle data key/values until the user interacts with the notification. There is a lot to learn in this area (and similar with iOS) unfortunately - sometimes it seems as much an art as a science