基于深度链接从 React Native Firebase 推送通知重定向到特定屏幕

Redirect to a specific screen from React Native Firebase Push Notifications based on a Deeplink

我遇到了问题,

1 ) 我正在使用 Firebase 发送远程推送通知,我通过从 FCM 测试仪发送进行测试。

2 ) 我已经在我的项目中激活了 Deep-Linking 并开始使用它。

3 ) 在 FCM 测试器中,我将此键值传递给“notifications.data”:

{ "link" : "MY_LINK" }

现在我希望我的应用程序能够识别其中的深层链接并阅读它。 我以某种方式做到了,但不是我想要的方式。

我做了什么:

NotificationContextProvider.ts

useEffect(() => {
    const unsubscribeClosedApp = messaging().onNotificationOpenedApp(
      remoteMessage => {
        addNotification(remoteMessage);
        console.log(
          'Notification caused app to open from background state:',
          remoteMessage.notification,
        );
        redirectFromKey(remoteMessage.data?.redirection);
        console.log(remoteMessage.data, 'remote message data');
        console.log(remoteMessage, 'remote message full');
        console.log(remoteMessage.notification?.body, 'remote message body');
        console.log(remoteMessage.notification?.title, 'remote message title');
        if (remoteMessage.data?.link === 'https://[MY-LINK]/TnRV') {
          console.log(remoteMessage.data?.link, 'Deeplink detected & opened');
          navigation.navigate({
            name: 'Logged',
            params: {
              screen: 'Onboarded',
              params: {
                screen: 'LastAnalyse',
              },
            },
          });
        }
      },
    );

它工作正常,但它不是基于读取 link,而是通过比较一个值,这不是我想要实现的。

Firebase Doc' 为我们提供了一种方法:https://rnfirebase.io/dynamic-links/usage#listening-for-dynamic-links

这是 Firebase 的建议:

import dynamicLinks from '@react-native-firebase/dynamic-links';

function App() {
  const handleDynamicLink = link => {
    // Handle dynamic link inside your own application
    if (link.url === 'https://invertase.io/offer') {
      // ...navigate to your offers screen
    }
  };

  useEffect(() => {
    const unsubscribe = dynamicLinks().onLink(handleDynamicLink);
    // When the component is unmounted, remove the listener
    return () => unsubscribe();
  }, []);

  return null;
}

而且我不知道如何让它发挥作用。 我必须提到 deep-links 在我的项目中正确设置并且工作正常,我的代码在 Typescript 中。

基本上您可以在此网页上找到我想要实现的目标,但我想使用 Firebase/messaging + 动态 links。我的项目不使用本地通知并且永远不会使用:https://medium.com/tribalscale/working-with-react-navigation-v5-firebase-cloud-messaging-and-firebase-dynamic-links-7d5c817d50aa

有什么想法吗?

我之前调查过这个,好像...

  • 您无法使用 firebase Compose Notification UI.
  • 在 FCM 消息中发送深度 link
  • 您可能可以使用 FCM REST API. More in this Whosebug post.
  • 在 FCM 消息中发送深度 link

REST API 实现起来很麻烦,您可能最好还是采用以下方式:使用具有少量数据有效负载的 firebase 消息编辑器,您的应用程序会解析消息数据转化酶 messaging 方法 firebase.messaging().getInitialNotification()firebase.messaging().onNotificationOpenedApp().

至于深度 linking,您的用户可能会在尝试分享内容时创建 in-app,或者您可能会在 firebase 中创建动态链接 UI:让您的应用注意设备上的实际深度 links,您可以使用 Invertase dynamic links 方法 firebase.dynamicLinks().getInitialLink()firebase.dynamicLinks().onLink().