🔥 [🐛] Not receiving notifications on iOs

[isonlaxman]

Issue

I'm using the latest version of @react-native-firebase/app and messaging but I can't get iOs notifications to work. Here are the steps I've taken so far:

1. Get an APNs Auth Key from Apple Developer website and add it to my Firebase project
2. Install the invertase libraries
3. call requestPermission and then getFcmToken
4. Use the FCM Token to 'send test message' on Firebase console

However, when I do this, nothing happens, I get no error anywhere. I'm stumped. I've gone through multiple issues on this repo, such as this and the one where Mike said to remove other push-notification libraries. Along with a whole lot other issues for the whole of the past week but I'm still failing to get this to work.

Here is the code where I call getFcmToken and requestPermission

notificationConfigure = async () => {
    // check if we have permissions
    let enabled = await messaging().hasPermission();

    if (enabled === messaging.AuthorizationStatus.AUTHORIZED) {
      const fcmToken = await messaging().getToken();
      console.log("TOKEN", fcmToken);

      if (fcmToken) {
        console.log(fcmToken);
      } else {
        // user doesn't have a device token yet
        console.warn("no token");
      }
    } else {
      await messaging().requestPermission();
      console.log("requested");

      enabled = await messaging().hasPermission();
      console.log("done", enabled);
      if (!enabled) {
        return false;
      }
    }

    return true;
  };

---

Project Files

Javascript

Click To Expand

package.json:

{
  "version": "sigma.1.23",
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "ios:8": "react-native run-ios --simulator 'iPhone 8'",
    "ios:12": "react-native run-ios --simulator 'iPhone 12'",
    "web": "expo start --web",
    "start": "react-native start",
    "test": "jest",
    "prettier": "prettier -w src/"
  },
  "dependencies": {
    "@invertase/react-native-apple-authentication": "^1.1.2",
    "@react-native-community/blur": "^3.6.0",
    "@react-native-community/datetimepicker": "3.0.4",
    "@react-native-community/google-signin": "^4.0.3",
    "@react-native-community/masked-view": "0.1.6",
    "@react-native-community/netinfo": "^5.9.2",
    "@react-native-firebase/analytics": "^10.5.0",
    "@react-native-firebase/app": "~10.5.0",
    "@react-native-firebase/messaging": "~10.5.0",
    "@react-navigation/bottom-tabs": "^5.10.1",
    "@react-navigation/native": "^5.8.10",
    "@react-navigation/stack": "^5.12.8",
    "@types/node": "^13.13.5",
    "@types/react-native-dotenv": "^0.2.0",
    "@types/react-native-version-check": "^3.4.0",
    "@types/react-redux": "^7.1.7",
    "@types/redux": "^3.6.0",
    "@types/redux-logger": "^3.0.7",
    "axios": "^0.19.2",
    "axios-logger": "^2.3.1",
    "expo": "^37.0.0",
    "expo-font": "~8.1.0",
    "expo-splash-screen": "^0.2.3",
    "expo-updates": "~0.2.0",
    "lodash": "^4.17.15",
    "native-base": "^2.13.14",
    "node": "^13.10.1",
    "prop-types": "^15.7.2",
    "react": "~16.13.1",
    "react-dom": "16.9.0",
    "react-native": "~0.63",
    "react-native-dotenv": "^0.2.0",
    "react-native-gesture-handler": "~1.6.0",
    "react-native-iap": "^5.2.3",
    "react-native-modal": "^11.6.1",
    "react-native-modal-datetime-picker": "^9.1.0",
    "react-native-payments": "^0.7.1",
    "react-native-safe-area-context": "0.7.3",
    "react-native-screens": "~2.2.0",
    "react-native-shimmer": "^0.6.0",
    "react-native-svg": "^12.1.0",
    "react-native-unimodules": "~0.9.0",
    "react-native-version-check": "^3.4.1",
    "react-native-walkthrough-tooltip": "^1.1.10",
    "react-native-web": "^0.11.7",
    "react-navigation": "^4.1.0",
    "react-redux": "^7.2.0",
    "redux": "^4.0.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-logger": "^3.0.6",
    "redux-persist": "^6.0.0",
    "redux-thunk": "^2.3.0"
  },
  "devDependencies": {
    "@babel/core": "^7.8.4",
    "@types/react": "^16.9.11",
    "@types/react-native": "^0.60.22",
    "babel-jest": "~25.2.6",
    "babel-preset-expo": "^8.1.0",
    "jest": "~25.2.6",
    "jest-expo": "^37.0.0",
    "prettier": "^2.2.1",
    "react-native-svg-transformer": "^0.14.3",
    "react-test-renderer": "~16.9.0",
    "typescript": "^3.8.3"
  },
  "jest": {
    "preset": "react-native"
  },
  "private": true
}

firebase.json for react-native-firebase v6:

# N/A

iOS

Click To Expand

ios/Podfile:

• I'm not using Pods
• I'm using Pods and my Podfile looks like:

require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/react-native-unimodules/cocoapods.rb'

platform :ios, '11.0'

target 'sofy' do
  config = use_native_modules!
  use_react_native!(:path => config["reactNativePath"])
  use_unimodules!(modules_paths: ['../node_modules'])


  # Enables Flipper.
  #
  # Note that if you have use_frameworks! enabled, Flipper will not work and
  # you should disable these next few lines.
  use_flipper!
  post_install do |installer|
    flipper_post_install(installer)
  end
end

AppDelegate.m:

/**
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */

#import "AppDelegate.h"

#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>

#import <UMCore/UMModuleRegistry.h>
#import <UMReactNativeAdapter/UMNativeModulesProxy.h>
#import <UMReactNativeAdapter/UMModuleRegistryAdapter.h>

#import <Firebase.h>



@interface AppDelegate ()

@property (nonatomic, strong) NSDictionary *launchOptions;

@end

@implementation AppDelegate

@synthesize window = _window;

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{

  if ([FIRApp defaultApp] == nil) {
    [FIRApp configure];
  }

  // Datepicker spinner issue fix
  if (@available(iOS 14, *)) {
    UIDatePicker *picker = [UIDatePicker appearance];
    picker.preferredDatePickerStyle = UIDatePickerStyleWheels;
  }
  
  self.moduleRegistryAdapter = [[UMModuleRegistryAdapter alloc] initWithModuleRegistryProvider:[[UMModuleRegistryProvider alloc] init]];
  self.launchOptions = launchOptions;
  
  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
#ifdef DEBUG
  [self initializeReactNativeApp];
#else
  EXUpdatesAppController *controller = [EXUpdatesAppController sharedInstance];
  controller.delegate = self;
  [controller startAndShowLaunchScreen:self.window];
#endif
  
  [super application:application didFinishLaunchingWithOptions:launchOptions];
  
  return YES;
}

- (RCTBridge *)initializeReactNativeApp
{
  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:self.launchOptions];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"main" initialProperties:nil];
  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];
  
  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
  
  return bridge;
}

// - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
//   BOOL handled = [[FBSDKApplicationDelegate sharedInstance] application:application openURL:url sourceApplication:options[UIApplicationOpenURLOptionsSourceApplicationKey] annotation:options[UIApplicationOpenURLOptionsAnnotationKey]
//                   ];
//   // Add any custom logic here.
//   return handled;
// }

- (NSArray<id<RCTBridgeModule>> *)extraModulesForBridge:(RCTBridge *)bridge
{
  NSArray<id<RCTBridgeModule>> *extraModules = [_moduleRegistryAdapter extraModulesForBridge:bridge];
  // You can inject any extra modules that you would like here, more information at:
  // https://facebook.github.io/react-native/docs/native-modules-ios.html#dependency-injection
  return extraModules;
}

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge {
#ifdef DEBUG
  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
  return [[EXUpdatesAppController sharedInstance] launchAssetUrl];
#endif
}

- (void)appController:(EXUpdatesAppController *)appController didStartWithSuccess:(BOOL)success
{
  appController.bridge = [self initializeReactNativeApp];
}

@end

---

Android

Click To Expand

Have you converted to AndroidX?

• my application is an AndroidX application?
• I am using android/gradle.settings jetifier=true for Android compatibility?
• I am using the NPM package jetifier for react-native compatibility?

android/build.gradle:

// N/A

android/app/build.gradle:

// N/A

android/settings.gradle:

// N/A

MainApplication.java:

// N/A

AndroidManifest.xml:

<!-- N/A -->

---

Environment

Click To Expand

react-native info output:

System:
    OS: macOS 10.15.6
    CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
    Memory: 67.38 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 14.2.0 - /usr/local/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.4 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.10.0 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 14.2, DriverKit 20.0, macOS 11.0, tvOS 14.2, watchOS 7.1
    Android SDK: Not Found
  IDEs:
    Android Studio: Not Found
    Xcode: 12.2/12B45b - /usr/bin/xcodebuild
  Languages:
    Java: 14.0.1 - /usr/bin/javac
    Python: 2.7.16 - /usr/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: ~16.13.1 => 16.13.1 
    react-native: ~0.63 => 0.63.4 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

• Platform that you're experiencing the issue on:
  • [ x] iOS
  • Android
  • iOS but have not tested behavior on Android
  • Android but have not tested behavior on iOS
  • Both
• react-native-firebase version you're using that has this issue:
  • @react-native-firebase/messaging v10.5.0
  • @react-native-firebase/app v10.5.0
• Firebase module(s) you're using that has the issue:
  • messaging and app
• Are you using TypeScript?
  • Y, v3.8.3

---

• 👉 Check out React Native Firebase and Invertase on Twitter for updates on the library.

[isonlaxman]

Quickly want to mention that I have not added any 'handlers' for the notification, because I don't have any need for them. Also, notifications don't work when the app is in foreground, background, or even quit.

[mikehardy]

Hmm some thoughts:

1- you want reproducible tests? Don't use the console to send messages, post JSON directly to the FCM REST API, and include that here so we can see what you're posting.
2- don't just remove packages, start from scratch to test this functionality in isolation. Your package.json is still stuffed full of things. Go completely minimal with firebase functionality (any of it really but especially messaging) in order to learn how it really works in isolation. That's what https://github.com/mikehardy/rnfbdemo/blob/master/make-demo.sh is for
3- Use an App.js that does the whole thing in isolation so we can perhaps actually reproduce. One method in isolation is not that useful
4- where is the error handling? no try catch?
5- use only real devices to test messaging. launch release build from Xcode and watch the output, with debugging flags enabled (#4603 (comment))
6- be aware of when the underlying SDKs will show notifications or not. The firebase-ios-sdk / firebase docs contain a table of app states vs which handlers are called vs JSON content, there is nothing to be either memorize it or have it ready at all times when comparing results vs expectations

Those are my best tips, but in general it's important to note that we're not aware of the module having any issues at the moment but messaging is hard, so it may not be easy to get working in your project but there is very little probability it will result in any actual activity here so beyond these tips there isn't much to offer

[goatandsheep]

your react-native-dotenv is out of date - maintainer

[mikehardy]

Please be specific, provide a link to the exact line of code you mean @goatandsheep? I'm not aware we use react-native-dotenv.

[goatandsheep]

@mikehardy sorry I was referring to the ticket author

[HoangNgocThang]

Fun onMessage not call in IOS, please can i help you ??
Here are the steps I've taken so far:

1.Get an APNs Auth Key from Apple Developer website and add it to my Firebase project
2.nstall the invertase libraries
3.call requestPermission and then getFcmToken
4. Listerner event from onMessage

if (Platform.OS == 'ios') {
const authorizationStatus = await messaging().requestPermission();
if (authorizationStatus === messaging.AuthorizationStatus.AUTHORIZED) {
console.log('User has notification permissions enabled.');
res?.currentUser?.fcmTopics.forEach((e) => {
this.messs
.subscribeToTopic(e)
.then(() => {
console.log(vao ${e} Subscribed to topic!, res)
})
.catch(e => {
console.log('loi ${e} Error Subscribed to topic!')
});
})

      this.messs.onMessage(async remoteMessage => {
        console.log('vaoooouuu')
        Alert.alert('A new FCM message arrived!', JSON.stringify(remoteMessage));
      });
    } else if (authorizationStatus === messaging.AuthorizationStatus.PROVISIONAL) {
      console.log('User has provisional notification permissions.');
    } else {
      console.log('User has notification permissions disabled');
    }

[AvibhavChoudhary]

Hey,
messaging().onMessage() is not triggering up when up is in the foreground, On the other hand, setBackgroundHandler works as expected.
This issue is occurring on an ios device, On android, it's working as expected.

[askndaer1]

hi @isonlaxman

Did u find any solution for this

[DCaiena]

same issue here @AvibhavChoudhary

[IronTony]

same issue here

[AvibhavChoudhary]

Please check the payload that you are sending in the notification.
Please have a look at this. ⬇️
https://rnfirebase.io/messaging/usage#receiving-messages

[droplessjordan]

Having the same issue. Did you figure this out? @isonlaxman

[Jamal-ReachFirst]

Reopen this issue

[ammaarkhan]

What is the update on this? Are push notifications working on iOS?

[ThetoMokganya]

Experiencing the same issue. Please reopen this issue.

[ammaarkhan]

Hey @ThetoMokganya, I did it get it to work and can confirm it is working. The issue for me was my bundle id on firebase wasn't the same as on my app. Creating a new ios app on firebase with the correct bundle id fixed it. I'd also recommend downloading postman for troubleshooting.

[ThetoMokganya]

Hi @ammaarkhan I realised that in the early hours of the morning, had uploaded the dev APNs certificate to the prod firebase project. Thank you though.

[ammaarkhan]

Hey @ThetoMokganya, glad to hear it's working for you. I sure was happy when I saw that first notification on an ios device!

[saperez17]

i was having the same issue, on Android it worked just fine, but on iOS the token was being fetched, device registered and message handlers setup all, but the sample notification was not arriving at the device. For me, the issue was that the bundle identifier on xcode (first image) was different to the one in firebase project (second image)