React Native集成极光消息推送
2019-06-21 本文已影响23人
Volon
极光IOS消息推送证书一键生成地址:https://onesignal.com/provisionator
一、申请激光账号并创建应用:地址:https://www.jiguang.cn
二、IOS推送设置
-
在苹果开发者账户中配置好自己的APP的应用ID,然后使用上述一键生成证书功能生成自己的开发证书(不要忘了勾上推送通知)!
这里写图片描述
这里写图片描述 -
在IOS推送设置中上传自己的证书(密码一键生成后会给出)
3.xcode修改
这里写图片描述
三、项目构建:
1.项目init:react-native init Test
2.安装:
npm install jpush-react-native jcore-react-native --save
3.执行link命令:
react-native link jpush-react-native
react-native link jcore-react-native --save
终端提示输入key时,将自己申请的key填入回车即可
四、项目中代码:
这里写图片描述
import React, { Component } from 'react';
import JPushModule from 'jpush-react-native'
import {
Text,
View
} from 'react-native';
export default class App extends Component<{}> {
jumpSecondActivity =() =>{
console.log('jump to SecondActivity')
}
componentDidMount () {
JPushModule.initPush();
//提示设备是否要接收通知
// JPushModule.setupPush();
JPushModule.getRegistrationID((id)=>{
console.debug(JSON.stringify(id));
console.log('id: ' + id)
})
JPushModule.addReceiveCustomMsgListener(map => {
console.log('extras: ' + map.extras)
})
JPushModule.addReceiveNotificationListener(map => {
console.log('alertContent: ' + map.alertContent)
console.log('extras: ' + map.extras)
})
JPushModule.addReceiveOpenNotificationListener(map => {
console.log('Opening notification!')
console.log('map.extra: ' + map.extras)
this.jumpSecondActivity()
// JPushModule.jumpToPushActivity("SecondActivity");
})
JPushModule.addGetRegistrationIdListener(registrationId => {
console.log('Device register succeed, registrationId ' + registrationId)
}) } componentWillUnmount(){ JPushModule.removeReceiveCustomMsgListener(receiveCustomMsgEvent) JPushModule.removeReceiveNotificationListener(receiveNotificationEvent) JPushModule.removeReceiveOpenNotificationListener(openNotificationEvent) JPushModule.removeGetRegistrationIdListener(getRegistrationIdEvent) 的console.log( '将清除所有通知') JPushModule.clearAllNotifications() } 渲染( ){ return( <View> <Text> Hello </ Text> </ View> ); } } ```
五,调用极光API:地址:
https://docs.jiguang.cn/jpush/server/push/rest_api_v3_push
推送通知案例:
![这里写图片描述](https://img.haomeiwen.com/i7169473/f79dfa5cc67f5ea2?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
![这里写图片描述](https://img.haomeiwen.com/i7169473/20049940d4681229?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
{
"platform":"all",
"audience":{
"registration_id":["这里填要发送的对象的注册ID或者平台"]
},
"notification":{
"alert":"我来玩玩 !",
"android":{
"extras":{
"android-key1":"android-value1"
}
},
"ios":{
"sound":"sound.caf",
"badge":"+1",
"extras":{
"ios-key1":"ios-value1"
}}},
"options":{
"apns_production":false
}}
base64验证来源:(网上有在线编码工具)
image.png