基于深度链接从 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()
.
我遇到了问题,
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()
.