在 iOS 中未收到 React Native 项目的通知

Question

我有一个反应本机项目。我能够成功接收 FCM 令牌，但是在尝试发送通知时，应用程序没有收到通知。
我遵循的步骤如下：

1. 在 Firebase 控制台中创建了一个项目。
2. 通过 Xcode 在 projectName 中添加了 Firebase .plist。
3. 跑了 npm install --save react-native-firebase
4. 在 podfile 中添加： pod ‘Firebase/Core’
5. 跑了 pod install
6. 使用#import <Firebase.h>和更新 AppDelegate.m[FIRApp configure];
7. 在 Firebase 仪表板中为 iOS 应用云消息传递添加了 APNS。
8. 更新了推送通知和后台模式 > 远程通知的功能
9. 在 info.plist FIRAnalyticsDebugEnabled、FirebaseAppDelegateProxyEnabled、FirebaseScreenReportingEnabled设置为No

使用const fcmToken = await firebase.messaging().getToken();我能够获得令牌。

下面是通知侦听器的代码。

async createNotificationListeners() {

    /*

     * Triggered when a particular notification has been received in foreground

     * */



    this.notificationListener = firebase.notifications().onNotification((notification) => {


        const {
            title,
            body
        } = notification;

        this.custom_data = notification.data;

        const localNotification = new firebase.notifications.Notification({

                show_in_foreground: true,

            })

            .setSound('default')

            .setNotificationId(notification.notificationId)

            .setTitle(notification.title)

            .setBody(notification.body)




        firebase.notifications()

            .displayNotification(localNotification)

            .catch(err => Alert.alert(err));

    });




    /*

     * If your app is in foreground and background, you can listen for when a notification is clicked / tapped / opened as follows:

     * */

    this.notificationOpenedListener = firebase.notifications().onNotificationOpened((notificationOpen) => {

        if ("title" in notificationOpen.notification.data) {

            const {
                title,
                body,
                secret_key,
                user_id,
                realm_id,
                user_os,
                user_location
            } = notificationOpen.notification.data;

            this.props.navigation.navigate('Verify', {
                title: title,
                body: body,

                secret_key: secret_key,
                user_id: user_id,
                realm_id: realm_id,
                user_os: user_os,
                user_location: user_location
            });

        } else {

            const {
                title,
                body,
                secret_key,
                user_id,
                realm_id,
                user_os,
                user_location
            } = this.custom_data;

            this.props.navigation.navigate('Verify', {
                title: title,
                body: body,

                secret_key: secret_key,
                user_id: user_id,
                realm_id: realm_id,
                user_os: user_os,
                user_location: user_location
            });

        }

    });



    /*

     * If your app is closed, you can check if it was opened by a notification being clicked / tapped / opened as follows:

     * */

    const notificationOpen = await firebase.notifications().getInitialNotification();

    if (notificationOpen) {

        const {
            title,
            body,
            secret_key,
            user_id,
            realm_id,
            user_os,
            user_location
        } = notificationOpen.notification.data;

        this.props.navigation.navigate('FCM', {
            title: title,
            body: body,

            secret_key: secret_key,
            user_id: user_id,
            realm_id: realm_id,
            user_os: user_os,
            user_location: user_location
        });

    }

    /*

     * Triggered for data only payload in foreground

     * */

    this.messageListener = firebase.messaging().onMessage((message) => {

        console.log("JSON.stringify:", JSON.stringify(message));

    });

}

如果需要更多详细信息，请告诉我。

编辑

我已经更新了代码。现在我可以让firebase.messaging().onMessage()代码工作并在前台接收触发器。当应用程序在后台时仍然无法收到通知。以下是我所做的更改。

const fcmToken = await firebase.messaging().getToken();

firebase.messaging().ios.registerForRemoteNotifications().then((flag)=>{
        console.log("registered", flag);
      }).catch((err)=>{
        console.log("message", err);
      });

AppDelegate.m

#import "AppDelegate.h"

#import <React/RCTBridge.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import <Firebase.h>
#import "RNFirebaseNotifications.h"
#import "RNFirebaseMessaging.h"


@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  [FIRApp configure];
  [[UNUserNotificationCenter currentNotificationCenter] setDelegate:self];
  [RNFirebaseNotifications configure];


  //[FIRApp configure];

  [Fabric with:@[[Crashlytics class]]];

  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
                                                   moduleName:@"CymmAuth"
                                            initialProperties:nil];

  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];

  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
  return YES;
}

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
#if DEBUG
  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
}


- (void)application:(UIApplication *)application didReceiveRemoteNotification:(nonnull NSDictionary *)userInfo
fetchCompletionHandler:(nonnull void (^)(UIBackgroundFetchResult))completionHandler{
  [[RNFirebaseNotifications instance] didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
}

- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings {
  [[RNFirebaseMessaging instance] didRegisterUserNotificationSettings:notificationSettings];
}

-(void) userNotificationCenter:(UNUserNotificationCenter *)center didReceiveNotificationResponse:(UNNotificationResponse *)response withCompletionHandler:(void (^)(void))completionHandler {

  [[RNFirebaseMessaging instance] didReceiveRemoteNotification:response.notification.request.content.userInfo];
  completionHandler();
}

@end

如果我遗漏了什么，请告诉我。firebase.notifications().onNotification()不会被触发

Answer 1

在参考了谷歌的多篇文章后，我设法解决了这个问题。我意识到很多人都面临这个问题。所以我提到了我已经实现的所有步骤和代码。

App Id 和 APNs 密钥需要从 Apple 的开发者帐户生成。生成 App Id 和 APNs 密钥后，将生成的 APNs 密钥添加到您的 Firebase 项目中。在您添加推送通知作为功能的 App Id 中，使用开发人员和生产服务 SSL 证书对其进行配置。

此外，请确保通过 Xcode将GoogleService-Info.plist文件添加到您的 iOS 项目中的项目名称下。

在Xcode 的签名和功能中添加推送通知和后台模式 > 远程通知、后台获取、后台处理（确认功能是否反映在调试和发布中）。

在 info.plist FIRAnalyticsDebugEnabled、FirebaseAppDelegateProxyEnabled、FirebaseScreenReportingEnabled设置为No

在 Xcode Scheme > Edit Scheme...检查Run patterns Build Configuration是否设置为Debug。当您在设备中调试应用程序时，这将有助于在 Xcode 中生成控制台。

1. 在 React 应用程序中 npm install --save react-native-firebase
2. 更新ios项目Podfile中的pods
   pod 'Firebase/Core' pod 'Firebase/Messaging' pod 'Firebase/Crashlytics' pod 'Firebase/Analytics' pod 'RNFirebase', :path => '../node_modules/react-native-firebase/ios'
3. cd ios > pod install

获取 FCM 令牌和 APNs 令牌的代码。

const fcmToken = await firebase.messaging().getToken();
      console.log("FCM_Token", fcmToken);

      firebase.messaging().ios.registerForRemoteNotifications().then((flag) => {
          firebase.messaging().ios.getAPNSToken().then(apns => {
            console.log("Apn Token", apns);
          }).catch((e) => {

          })
        }).catch((err) => {
          console.log("message", err);
        });

AppDelegate.m

#import "AppDelegate.h"
#import <React/RCTBridge.h>    
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>    
#import <Firebase.h>    
#import "RNFirebaseNotifications.h"    
#import "RNFirebaseMessaging.h"


@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  [FIRApp configure];
  [RNFirebaseNotifications configure];

  [[UNUserNotificationCenter currentNotificationCenter] setDelegate:self];
  [application registerForRemoteNotifications];
  [Fabric with:@[[Crashlytics class]]];


  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];

  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge

                                                   moduleName:@"CymmAuth"

                                            initialProperties:nil];



  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];



  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];

  UIViewController *rootViewController = [UIViewController new];

  rootViewController.view = rootView;

  self.window.rootViewController = rootViewController;

  [self.window makeKeyAndVisible];

  return YES;

}



- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge

{

#if DEBUG

  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];

#else

  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

#endif

}

- (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification {
  [[RNFirebaseNotifications instance] didReceiveLocalNotification:notification];
}

- (void)application:(UIApplication *)application didReceiveRemoteNotification:(nonnull NSDictionary *)userInfo
fetchCompletionHandler:(nonnull void (^)(UIBackgroundFetchResult))completionHandler{
  [[RNFirebaseNotifications instance] didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
}

- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings {
  [[RNFirebaseMessaging instance] didRegisterUserNotificationSettings:notificationSettings];
}

- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken {
[FIRMessaging messaging].APNSToken = deviceToken;
}
@end

AppDelegate.h

#import <React/RCTBridgeDelegate.h>
#import <UIKit/UIKit.h>
#import <Firebase.h>
#import <UserNotifications/UserNotifications.h>
@import UserNotifications; 
@interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate, UNUserNotificationCenterDelegate>

@property (nonatomic, strong) UIWindow *window;

@end

这将在您的 Apple 设备上收到通知。

为了测试通知、FCM 令牌有效性以及从 APNs 令牌重新生成有效的 FCM 令牌，有一个 Firebase 的 API 调用。这可能是测试的额外帮助。

1. 发送推送通知

端点：https ://fcm.googleapis.com/fcm/send
类型：POST
标题：授权：“key:fcm_server_key” 正文
：{ "to": "fcm_token", "content_available": true, "mutable_content": true, "data": { "message": "Batman!", "mediaUrl": "https://upload.wikimedia.org/wikipedia/commons/thumb/2/2a/FloorGoban.JPG/1024px-FloorGoban.JPG" }, "notification": { "body": "Enter your message", "sound": "default" } }

2. 验证您的 FCM 令牌

端点：https ://iid.googleapis.com/iid/info/your_fcm_token
类型：GET
标头：授权：“key:fcm_server_key”

3. 使用 APNs 令牌重新生成 FCM 令牌

端点：https ://iid.googleapis.com/iid/v1:batchImport
类型：POST
标头：授权：“key:fcm_server_key” 正文
：{ "application":"package Id", "sandbox":true, "apns_tokens":[ "apnstoken 1","apnstoken 2" ] }

我希望这有帮助。谢谢你。