反应-原生使用leanclound消息推送的方法

ios消息推送的基本流程

1.注册：为应用程序申请消息推送服务。此时你的设备会向服务器服务器发送注册请求。2.服务器服务器接受请求，并将令牌返给你设备上的应用程序3.客户端应用程序将令牌发送给后台服务器程序，后台接收并储存。 4.后台服务器向服务器服务器发送推送消息5.服务器服务器将消息发给令牌对应设备上的应用程序

使用leanclound进行消息推送

优势：文档清晰，价格便宜

接入Leanclound

1.首先需要创建一个反应原生项目

react-native init projectName2 .在数据存储创建一个同名项目，并记录好应用编号和应用详细页查询

3.项目创建成功后，安装推送所需的模块（需要激光唱片到工程目录)

1.使用故事安装

纱线添加leancloud-storageyarn添加lean cloud-安装2 .使用新公共管理安装

新公共管理安装lean云存储- savenpm安装瘦云-安装-保存4 .在项目目录下新建一个文件夹，名字为pushservice，在里面添加一个射流研究…文件PushService.js，处理消息推送的逻辑，

1.在index.js初始化leanclound

从"瘦云存储"导入影音./**添加注册的应用编号和appKey */const appId=' ht23 ehddzafflk 9 imtdl 10 te-gzGzoHsz ' const appKey=' tyi CB 5k kemj 7xdyzwpgifta '/* *初始化*/AV.initialize(appId，appKey)；/**把装置设为全局变量，在其他文件方便使用*/全局。安装=需要(“精益云安装”)(AV)；2.iOS端配置

首先，在项目中引入RCTPushNotification，详情请参考：链接库-反应本地文档

步骤一：将推送通知项目拖到ios主目录，推送通知路径：当前项目/node _ modules/react-native/Libraries/PushNotificationIOS目录下

步骤二：添加libRCTPushNotification静态库，添加方法：工程目标-构建阶段-将二进制文件与库链接点击添加，搜索libRCTPushNotification.a并添加

步骤三：开启推送功能，方法：工程目标-能力找到推送通知并打开

步骤四：在Appdelegate.m文件添加代码

#导入反应/rctpusnotificationmanager。h.//注册推送通知-(void)应用程序：(ui应用程序*)应用程序滴滴出行用户通知设置：(ui用户通知设置*)通知设置{[RCPushNotificationmanager滴滴出行用户通知设置：通知设置]；}//注册事件必需-(void)application :(ui application *)application did GRE ister for remotification switch device token :(NSData *)device token {[rcpushnotification manager did GRE ister for remotification switch device token : device token]；}//通知事件必需。您必须在处理远程通知后调用完成处理程序-(void)应用程序：(ui应用程序*)应用程序direceiveremote通知：(ns字典*)用户infofetchcompletionhandler :(void(^)(uibackgroundfetchresult))completionhandler{ nslog(@)收到通知：%@ '，userInfo)；[rctpnotification manager确实收到了远程通知：用户信息fetch completionhandler : completionhandler]；}//注册错误事件所需-(void)application :(ui application *)application didfiletorregister for remotification witherror :(NSError *)错误{ NSLog(@ '错误==%@ '，错误)；[rctpusnotification manager DidFailToregister for Remotionswiterror :错误]；localNotification事件必需-(void)应用程序：(ui应用程序*)应用程序目录本地通知：(UILocalNotification *)通知{ NSLog(@ '接受通知：%@ ',通知);[rctpnotification manager DireceiveLocalNotiFication :通知]；}5.获取deviceToken，并将令牌插入到_安装

找到PushService文件，编写代码

//请参考push notification onst push notification IOs=require(' react-native ')。pushnotificationios.类PushService {//初始化push init_pushService=()={//添加侦听事件pushnotificationios。addeventlistener ('register ),这。register _ push)；//请求权限pushnotificationios . request permissions()；}//回调register _ push=(devicetoken)={//判断device token是否if (devicetoken) {this。已成功获取savedevicetoken (devicetoken );} }//保存device token=(device token)={ global。Installation.getcurrent()。然后在安装表中(installation={ installation . set(' device type '，' IOs ')；Installation.set('apnsTopic '，' engineering bundle id ')；installation.set('deviceToken '，deviceToken)；返回installation . save()；});}}修改App.js文件以初始化组件安装中的推送

从“”导入PushService。/push service/push service '；component idmount(){//初始化PushServiCe . init _ PushServiCe()；}要运行这个项目，deviceToken只能由真机获取，模拟器却无法获取。查看设备令牌是否已保存。如果保存成功，leandcloudbackground可以发现_Installation表中还有一个数据

已经完成一半了。现在您只需要配置推送证书来接收推送消息。这里不介绍配置证书的过程。详细步骤请参考iOS推送证书设置。推送证书设置完成后，转到leanclound看能否收到推送，退出APP，让APP处于后台状态。

单击“发送”查看您是否收到了该消息。

转到这一步说明推送已经完成了一大半。当然，APP还需要包括以下功能：

APP还可以在前台、后台或关闭状态下接收推送消息。点击通知对消息进行操作，如当特定页面APP处于前台状态时，跳转到通知的显示

当APP在前台运行时，iOS不会提醒你(iOS10以后会支持前台显示)，所以需要实现的功能是接收通知并在前端显示。此时，将使用一个模块来支持该功能，即react-native-message-bar。

第一步是安装反应原生消息栏模块

纱线添加反应-原生-消息栏//纱线安装或NPM安装反应-原生-消息栏-保存//NPM安装成功，然后引入消息栏并注册到App.js文件中

./* *介绍显示通知模块*/const messagebarlert=require(' react-native-message-bar ')。const MessageBarManager=require(' react-native-message-bar ')。MessageBarManager.component idmount(){//初始化PushServiCe . init _ PushServiCe()；messagebarmanager . registersmessagebar(this . alert)；} .render () {const {nav}=this。state if(nav){ return(//navigation)在这里使用，所以需要写出来，这样布局才不会混乱。MessageBarAlert绑定了警报视图样式={ { flex : 1 }。} } nav/messagebarallert ref={(c)={ this。alert=c}}//view)}返回view/}，然后修改PushService，添加通知事件监控和推送消息的新显示

从“反应-原生”导入{ AppState，NativeModules，Alert，DeviceEventEmitter }；//初始化推送init_pushService=()={ //添加监听事件推送通知.addEventListener('register '，这个。register _ push)；pushnotificationios。addeventlistener('通知')，这_ onNotification)；//请求权限pushnotificationios。请求权限()；} _ onNotification=(通知)={ var state=appstate。currentstate//判断当前状态是否是在前台if (state==='active') { this ._showAlert(通知_ alert)；} } ._showAlert=(消息)={ const MessageBarManager=require(' react-native-message-bar ').messagebarmanagermessagearmanager。showalert({ title : '您有一条新的消息，message: message，alertType: 'success '，样式表success : {背景色： ' # 7851 B3 '，titleColor: '#fff '，messageColor: '#fff' }，视图topinset : 20 })；} .最后重新运行应用并在leanclound发送一条消息，看是否在应用打开状态也能收到通知，到了这里推送就完成了

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。