响应本机Firebase 6云消息传递和推送通知

Question

我正在使用本机和firebase 6来发送推送通知。我使用新版本的正式文档：https://invertase.io/oss/react-native-firebase/v6

我为android和ios添加了本机代码，以处理发送和接收通知。

在我的AndroidManifest.xml：

<!-- [START firebase_service] -->
        <service
            android:name=".java.MyFirebaseMessagingService"
            android:exported="false">
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
        </service>
        <!-- [END firebase_service] -->

我没有创建MyFirebaseMessagingService。

M我添加了一些函数：

// Required for the register event.
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{
  [FIRMessaging messaging].APNSToken = deviceToken;
  [RNCPushNotificationIOS didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
  NSLog(@"APNs device token retrieved: %@", deviceToken);
}

// Required for the registrationError event.
- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error
{
  [RNCPushNotificationIOS didFailToRegisterForRemoteNotificationsWithError:error];
  NSLog(@"Unable to register for remote notifications: %@", error);
}
// Required for the localNotification event.
- (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification
{
  [RNCPushNotificationIOS didReceiveLocalNotification:notification];
}

在我的Component.js中，我得到了这样的令牌：

// Firebase
import firebase from '@react-native-firebase/app'
import messaging from '@react-native-firebase/messaging'

  // ----- COMPONENT DID MOUNT ---- //
  async componentDidMount () {
    // ====================================================== //
    // ====================================================== //
    // ====================================================== //
    const granted = messaging().requestPermission()

    if (granted) {
      console.log('User granted messaging permissions!')
      // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ //
      firebase
        .messaging()
        .getToken()
        .then(fcmToken => {
          if (fcmToken) {
            // user has a device token
            console.log('-------- FCM TOKEN -------')
            console.log(fcmToken)
            console.log(JSON.stringify(fcmToken))
            this._setItem(fcmToken)
          } else {
            // user doesn't have a device token yet
            console.log('error')
          }
        })
      // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ //
    } else {
      console.log('User declined messaging permissions :(')
    }
    // ====================================================== //
    // ====================================================== //
    // ====================================================== //
  }
  // ----- FIN COMPONENT DID MOUNT ---- //

我向https://fcm.googleapis.com/fcm/send发送邮件请求：

{
 "to" : "token",
 "notification" : {
 "body" : "un nouveau partage",
 "title" : "un partage de contact reçu",
 "priority" : "high",
 "vibration":true,
 "sound": "Enabled",
 "badge":1,
 "requireInteraction": true,
 "click_action": "fcm.ACTION.HELLO"
 },
 "data" : {
 "body" : "nouvelle opportunité",
 "title" : "un nouveau partage",
 "content_available" : true,
 "priority" : "high"
 } 
}

我收到android和ios的通知，但无法处理单击操作：

当用户单击通知时，我想重定向到特定的路由。

Answer 1

我还没有使用Firebase进行通知，但正如您说的通知是有效的，那么在我看来，实际的问题似乎是您希望在应用程序打开时处理它。

下面是你完成工作所必须遵循的步骤。

1. 在事件onNotificationOpened上获取通知中的数据。查看此链接以检查是否获得通知数据。
2. 接下来，您希望在通知的基础上选择特定的路由。我要做的是，发送与该屏幕相关的屏幕类型和id，以便导航到那里，例如：

{
    "entity": "Place",
    "id": "123"
}

因此，当我收到通知时，我将数据发送到一个开关箱工厂，该工厂根据数据中的信息导航到屏幕。差不多吧。

function navigateToScreen(entity:string, id:string){

   let screenName = "";
   let params = {}

   switch(entity){
      case "Place": 
          screenName = "placeScreen";
          params = {id};
          break;
      default: return;
   }

   // Navigation Service = https://reactnavigation.org/docs/navigating-without-navigation-prop/
   NavigationService.navigate(screenName, params);

}

1. 现在，如果您想在通知的基础上运行一个特定的函数，您可以根据收到的信息来运行它。与本例一样，我必须创建一个API req，以便通过id获取该位置的数据。

const id = props.match.params['id'];

useEffect(() => {
    getThePlaceDetails(id);
}, [id]);