（五）[极光推送通知 IOS & 安卓]React Native 从零到构建Android与IOS应用发布

由于我们都会遇到推送通知服务，而看到网上教程多半都是极光的，并且口碑都不错，所以我也使用极光的把。

整合极光推送也耗费了不少时间，问题不断，多亏极光官网的工作人员大力支持（邮件+QQ群），顺利的调试通了极光推送，感谢！

这是极光推送的RN官方开发者群，遇到问题找群主，妥妥的，qq群：553406342

写在前面，注意事项：

1、安卓和IOS的配置不一样

2、IOS推送机制与安卓不一样，安卓是直接连接极光推送服务器，而IOS则是需要通过苹果的ANPS下发到设备

所以，安卓可以通过模拟器进行调试，而苹果，必须要使用真机调试！！！！

准备事项：

1、注册极光推送官网账户，创建推送应用 获取appKey

2、（IOS）注册苹果development账户

安卓篇

---

安卓的安装配置稍微简单些，我推荐KenChoi的教程，链接：http://www.jianshu.com/p/6721a0360af9

手动配置主要注意几个点，当然自动配置也最好检查一下，我遇到过重复代码的问题

1、build.gradle需要添加jpush和jcore的依赖

2、settings.gradle需要include jpush-react-native和jcroe-react-native

3、AndroidManifest需要增加 meta-data

4、在 MainApplication.java 中注册JPushPackage类

5、MainActivity 加入监听事件onCreate、onPause、onResume

然后就可以通过import JPushModule from 'jpush-react-native'; 来使用jpush的方法了

值得注意的是：

JPushModule.initPush(); // 注册监听，在注册props时就需要

安卓下需要在componentDidMount中监听前加入以下代码才能获取推送（网上是这么说的，我没试过删除是否能收到，反正加了是能收到）

JPushModule.notifyJSDidLoad((resultCode) => {

    if (resultCode === 0) {

    }

});

监听方法新版的Jpush 安卓和IOS都一致了（在 componentDidMount 中 notifyJSDidLoad 之后）

JPushModule.addReceiveNotificationListener((message) => { // 收到通知时触发

        console.log(message);

});

JPushModule.addReceiveOpenNotificationListener((message) => { // 点击托盘通知进入APP触发

        console.log(message);

});

然后在 componentWillUnmount 中移除监听

JPushModule.removeReceiveCustomMsgListener();

JPushModule.removeReceiveNotificationListener();

安卓推送就OK了，一次性搞定

---

IOS篇

IOS非常麻烦，首先，你需要在development开发者中心中的 Certificates, Identifiers & Profiles 中

1、注册 iOS Certificates 证书

创建证书

如图，我已经创建了证书，需要创建的证书有4个，一个APNS开发者证书，一个APNS生产环境证书，一个IOS开发者证书，一个IOS生产环境证书。

关于如何创建证书，请移步：http://www.jianshu.com/p/01224fc523d4

2、注册APP应用，Identifiers

在Xcode的target下的General中的Signing中选择你的team，team也就是你的苹果开发者帐号，选择后点击development官网上的App Ids新增一个即可，上面的链接有资料

3、注册真机调试设备，Devices

用苹果手机连接mac，然后在itunes中点击手机图标，在手机信息中，点击序列号，会变成UDID，然后在development官网上的Devices中新增一个设备，输入名称和UDID注册即可

4、注册Provisioning Profile

注册方式跟前面差不多

这个需要注册开发者和生产环境的profile，否则XCode选择Signing 和push notifications时会出现红色感叹号

（请注意）上面的注册完毕后，下载APNS对应的证书，然后添加到mac钥匙串中（双击导入），然后右键对应的证书，点导出，然后需要输入加密的密码，你自己随便填，然后导出.p12的文件，其中需要注意的是， 请命名好各自对应的证书，开发环境和生产环境不一样，

而这两个证书是需要上传到极光推送应用配置中的IOS配置中的，会根据证书自动生成bundle ID，所以需要特别注意

做好这些工作后，就是安装JPUSH了

与安卓不太一样的就是

npm i -g jpush-react-native --save

yarn add jpush-react-native

npm i -g jcore-react-native --save

yarn add jcore-react-native

我试过使用

npm run configureJPush **** appname

自动配置，但是报错提示安卓文件找不到，我MAC下并未配置安卓环境

但是代码却是修改了，这是最省力的，所以这一步是需要执行

然后运行

react-native link

将library加入到xcode工程中

Libraries就多了 RCTJCoreModule.xcodeproj 和 RCTJPushModule.xcodeproj

然后选择 APP的target 点击 Capabilities 项，将 Push Notifications 从off改为On，之前的证书OK的话，这里就是2个勾了，如果证书不OK，那请重新配置证书，将 Background Modes 从Off改为On,只勾选 Remote notifications

然后点击 build Settings 项。将 Code Signing Identity 和它的子项全改为 iOS Developer

然后点击 Build Phases ，展开Link Binary With Libraries ，找到UserNotifications.framework 改为 Optional

然后在Xcode左侧打开 AppDelegate.h ，在UIKit后加入

#import

//

static NSString *appKey=@"你的Appkey";

static NSString *channel=@"nil";

static BOOL isProduction=true; //生产环境false 正式true

注意，由于IOS9以上禁止访问HTTP，要求API必须请求HTTPS，所以包括极光我们需要增加策略

在info.plist的 App Transport Security Settings 下增加 Allow Arbitrary Loads = YES

在Exception Domains 下（react native init时就会创建并加入localhost访问http的策略）增加

jpush.cn = Dictionary

然后在jpush.cn下增加 

NSExceptionAllowsInsecureHTTPLoads=YES

NSIncludesSubdomains=YES

即可完成安全策略的配置，如图

！！！！！！注意，由于不支持HTTP，所以如果你的API是通过HTTP访问的话，你需要创建一个跟jpush.cn配置一样的你的域名在Exception Domains下面，否则会出现network failed错误！具体用顶级域名就好，多个请求域名要配置多个域名配置，马赛克部分就是我的域名，只要配置顶级域名就可支持子域名了。

Xcode安全策略配置

然后build一下Xcode，至此，极光IOS配置完成，很简单的但是由于不熟悉，所以走了很多弯路

然后，在IOS下必须要注册监听，否则无法正常监听推送

根据群主的建议，我在index.js 中加入了

import JPushModule from 'jpush-react-native';

JPushModule.addnetworkDidLoginListener(() => {

});

然后在component中操作和安卓一样，在componentDidMount中监听

JPushModule.addReceiveNotificationListener((message) => { // 收到通知时触发

console.log(message);

});

JPushModule.addReceiveOpenNotificationListener((message) => { // 点击托盘通知进入APP触发

console.log(message);

});

然后在componentWillUnmount中移除监听

JPushModule.removeReceiveCustomMsgListener();

JPushModule.removeReceiveNotificationListener();

然后上真机调试，OK，正常收到推送，至此极光推送配置完成，感谢群主HuminiOS的支持