react-nativepush-notificationexporeact-native-push-notificationexpo-notifications

Expo SDK 39 Push Notifications Not Working


Can anyone see what I am doing wrong here? I upgraded to expo SDK 39 and the push notifications stopped working. I have been debugging for a few days now and can't seem to figure it out. I can see that the token and message are coming in correctly and I can see that EXPO has notification access under settings. I was able to run tests with push notifications before with EXPO so not sure what broke with SDK v 39. Any help would be really appreciated.

Function that runs when a user sends a chat message

const handleMessageSend = (msg) => {
    const index = messages.length ? messages[messages.length - 1].index + 1 : 0;
    const chat = {
      key: uid,
      index,
      receiver: [match.id],
      ...msg[0],
    };
    addChat(chat);
    setMessages([chat].concat(messages));
    let matchExpoToken = match.info.pushNotificationToken;
    if (matchExpoToken != "") {
      let messageBody = user.infoData.fullName + " sent you a new message";
      PushNotifications(matchExpoToken, messageBody);
    }
};

PushNotifications.js

// import * as Notifications from "expo-notifications"; //I have tried both of the imports with no luck
// import { Notifications, Permissions } from "expo";

const PushNotifications = async (matchExpoToken, messageBody) => {
  console.log("matchExpoToken", matchExpoToken, messageBody);
  const message = {
    to: matchExpoToken,
    sound: "default",
    title: "New Message",
    body: messageBody,
    data: { data: "new message" }, //todo: what is this "data"?
    _displayInForeground: true,
  };

  const response = await fetch("https://exp.host/--/api/v2/push/send", {
    method: "POST",
    headers: {
      Accept: "application/json",
      "Accept-encoding": "gzip, deflate",
      "Content-Type": "application/json",
    },
    body: JSON.stringify(message),
  });    
};

export default PushNotifications;

Expo Diagnostics

Expo CLI 4.0.4 environment info:
System:
  OS: macOS 11.0.1
  Shell: 5.8 - /bin/zsh
Binaries:
  Node: 15.3.0 - /usr/local/bin/node
  Yarn: 1.22.10 - /usr/local/bin/yarn
  npm: 7.0.14 - /usr/local/bin/npm
SDKs:
  iOS SDK:
    Platforms: iOS 14.3, DriverKit 20.2, macOS 11.1, tvOS 14.3, watchOS 7.2
  Android SDK:
    API Levels: 29, 30
    Build Tools: 30.0.2
    System Images: android-30 | Google APIs Intel x86 Atom
IDEs:
  Android Studio: 4.1 AI-201.8743.12.41.6953283
  Xcode: 12.3/12C33 - /usr/bin/xcodebuild
npmPackages:
  expo: ^39.0.0 => 39.0.5 
  react: 16.13.1 => 16.13.1 
  react-dom: 16.13.1 => 16.13.1 
  react-native: https://github.com/expo/react-native/archive/sdk-39.0.3.tar.gz => 0.63.2 
  react-navigation: ^3.13.0 => 3.13.0 
npmGlobalPackages:
  expo-cli: 4.0.4
Expo Workflow: managed

Yarn / package-lock.js files

"expo-notifications": "~0.1.1",

Solution

  • First- you should run expo install expo-notifications, since the proper version for SDK 39 is expo-notifications@~0.7.2

    If, as you said, the message is coming through, then I'm not 100% sure what the problem it is, but it is probably somewhere in your notification listener (addNotificationReceivedListener) if I had to guess. The best thing to do would be to take a look at the example from the docs and debug from there

    Edit: actually, if this is only on android then I think another issue might be that you forgot to set the useNextNotificationsApi value in. your app.json file:

    {
      "expo": {
        ...
        "android": {
          ...
          "useNextNotificationsApi": true,
        }
      }
    }