? ? ? ? 之前集成了個推到項目中植锉,現(xiàn)在需要完成接收到消息后展示通知(Notification)飒泻,消息發(fā)送通過個推(消息發(fā)送使用的是個推的透傳葫督,和整個個推渠道有區(qū)別健田,不會自動生成notification)士修,只需要在接收到消息后章贞,生成展示notification备埃。這里使用插件react-native-push-notification
? ? ? ? 1尼桶、在 終端進入到殼子根目錄下分別執(zhí)行
npm install react-native-push-notification
react-native link?react-native-push-notification
執(zhí)行react-native run-android节槐,終端報錯
修改引入的react-native-push-notification版本到3.1.3搀庶,再進入到react-native-push-notification依賴包的build.gradle文件,修改依賴的第三方包版本如下
可正常運行Android 端(react-native run-android)
2铜异、終端進入到自己的項目根目錄下分別執(zhí)行
npm install react-native-push-notification@3.1.3
react-native link?react-native-push-notification
在官網(wǎng)中哥倔,有這么一段話
翻譯一下
然后按照對應版本的官方文檔react-native-push-notification - npm,進行Android端設(shè)置揍庄,在殼子android下的AndroidManifest.xml文件中咆蒿,添加如下代碼(只做notification展示,所以只需要PushNotification.localNotification()即可):
<service
????????????android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"
????????????android:exported="false"?>
????????????<intent-filter>
????????????????<action?android:name="com.google.firebase.MESSAGING_EVENT"?/>
????????????</intent-filter>
?</service>
<meta-data android:name="com.dieam.reactnativepushnotification.notification_channel_name" android:value="YOUR NOTIFICATION CHANNEL NAME" />
<meta-data android:name="com.dieam.reactnativepushnotification.notification_channel_description" android:value="YOUR NOTIFICATION CHANNEL DESCRIPTION" />
<!-- Change the resource name to your App's accent color - or any other color you want -->
<meta-data android:name="com.dieam.reactnativepushnotification.notification_color" android:resource="@android:color/white" />
在需要引用notification的地方添加代碼:
PushNotification.localNotification({
? ? ? /* Android Only Properties */
? ? ? id: '0', // (optional) Valid unique 32 bit integer specified as string. default: Autogenerated Unique ID
? ? ? ticker: "My Notification Ticker", // (optional)
? ? ? autoCancel: true, // (optional) default: true
? ? ? largeIcon: "ic_launcher", // (optional) default: "ic_launcher"
? ? ? smallIcon: "ic_notification", // (optional) default: "ic_notification" with fallback for "ic_launcher"
? ? ? bigText: "My big text that will be shown when notification is expanded", // (optional) default: "message" prop
? ? ? subText: "This is a subText", // (optional) default: none
? ? ? color: "red", // (optional) default: system default
? ? ? vibrate: true, // (optional) default: true
? ? ? vibration: 300, // vibration length in milliseconds, ignored if vibrate=false, default: 1000
? ? ? tag: 'some_tag', // (optional) add tag to message
? ? ? group: "group", // (optional) add group to message
? ? ? ongoing: false, // (optional) set whether this is an "ongoing" notification
? ? ? priority: "high", // (optional) set notification priority, default: high
? ? ? visibility: "private", // (optional) set notification visibility, default: private
? ? ? importance: "high", // (optional) set notification importance, default: high
? ? ? /* iOS only properties */
? ? ? alertAction: 'view',// (optional) default: view
? ? ? category: null,// (optional) default: null
? ? ? userInfo: null,// (optional) default: null (object containing additional notification data)
? ? ? /* iOS and Android properties */
? ? ? title: "My Notification Title", // (optional)
? ? ? message: "My Notification Message", // (required)
? ? ? playSound: false, // (optional) default: true
? ? ? soundName: 'default', // (optional) Sound to play when the notification is shown. Value of 'default' plays the default sound. It can be set to a custom sound such as 'android.resource://com.xyz/raw/my_sound'. It will look for the 'my_sound' audio file in 'res/raw' directory and play it. default: 'default' (default sound is played)
? ? ? number: '10', // (optional) Valid 32 bit integer specified as string. default: none (Cannot be zero)
? ? ? repeatType: 'day', // (optional) Repeating interval. Check 'Repeating Notifications' section for more info.
? ? ? actions: '["Yes", "No"]',? // (Android only) See the doc for notification actions to know more
? ? });
運行Android 端之后蚂子,可以看到發(fā)送的notification成功
通過調(diào)整PushNotification.localNotification參數(shù)來達到需要的樣式和信息沃测。
3、點擊notification
notification的點擊觸發(fā)通過PushNotification.configure()來實現(xiàn)食茎。其中的方法
onNotification: function (notification) {
? ? ? ? console.log('NOTIFICATION:', notification);
? ? ? ? // process the notification
? ? ? ? // required on iOS only (see fetchCompletionHandler docs: https://facebook.github.io/react-native/docs/pushnotificationios.html)
? ? ? ? // notification.finish(PushNotificationIOS.FetchResult.NoData);
? ? ? },
其中的notification參數(shù)會把第二步中的PushNotification.localNotification()全部參數(shù)返回蒂破,通過解析來達到跳轉(zhuǎn)或者網(wǎng)絡請求。
到這一步為止别渔,Android端的notification就完成了寞蚌。
4、再來看一看iOS钠糊。先不修改代碼挟秤,直接運行看看會有什么效果。emmm~~雖說不會報錯抄伍,但也沒有任何效果
做了各種配置艘刚,也進行了各種測試,浪費了很久的時間才發(fā)現(xiàn)截珍,ios模擬器不支持消息推送攀甚,一口老血噴出來箩朴。既然這樣的話,ios的推送就放到等到公司提供了測試機之后的篇章里講吧秋度。