美文网首页React Native学习
React-Native极光推送双端配置

React-Native极光推送双端配置

作者: 向前Hell | 来源:发表于2017-12-06 10:40 被阅读54次

开发步骤

  1. 安装WebStorm,激活使用
  2. 安装node到默认位置
  3. 配置npm的镜像资源(国内访问
  4. npm安装yarn、react-native-cli
  5. 在WebStorm新建项目,选择React-Native,并选择保存地址,设置项目名称,进行创建

环境配置

  1. init新建一个项目之后,将node_modules删除,并且在项目文件夹中执行npm install, 重新安装所有的插件。
  2. 选择要用的组件,进行 npm install yourComponent --save
  3. 可以使用yarn add 代替 npm installl

iOS开发者证书申请

  1. 拥有一个iOS开发者账号,$99一年
  2. 在Xcode9中打开React-Native项目中的../<name>/ios/***.xcodeproj
  3. 修改Bundle Identifier【重要】(后面会在JPush推送设置中使用,务必小心统一)
  4. 选择Signing中的Team
  5. 进入Capabilities,打开Push Notifications,稍等一会即可,再打开Background Modes,选择最后一个Remote notifications
  6. 进入开发者证书配置,直接选择App IDs,找到ID为你设置的Bundle Identifier的项目,点击展开,最下面找到Edit,找到Push Notifications
  7. Create an additional certificate to use for this App ID. 开发环境和生产环境,全部变绿即可

极光官网配置

  1. 进入极光开发者服务,创建一个应用,应用名 按照要求填写,自己上传图标
  2. 创建成功,看到AppKey,在下面找到推送设置,开始配置
  3. 采用Token Authentication,在开发者网站,找到Keys,点击加号,生成一个Key,名字自定,下载到本地(重要,保存)
  4. 在配置页面,进行iOS配置,上传APNs Auth Key,选择上面生成的文件
  5. 开发者网站中,找到刚刚生成的Key ID,复制到配置界面
  6. 在[开发者网站]中,找到Team ID,复制到配置界面
  7. 在Bundle ID中,填写你设置的Bundle ID,配置完成,保存,然后在选择鉴权方式中选择Token Authentication

JPush 极光推送配置

  1. npm install jpush-react-native --save执行成功
  2. npm install jcore-react-native —save执行成功
  3. jpush需要的组件安装完毕,在极光官网创建一个项目,找到appKey
  4. 在项目目录中执行 npm run configureJPush <yourAppKey> <yourModuleName>
  5. 上述执行成功后,执行react-native link
  6. 参考极光推送React-Native进行手动配置
  7. 需要iOS开发者证书支持

手动配置iOS

  1. Xcode9打开项目文件,找到info.plist,设置ATS权限
    App Transport Security Settings
    添加Allow Arbitrary Loads : YES
    子目录下Exception Domains
    添加jpush.cn
    jpush.cn下添加
    NSExceptionAllowsInsecureHTTPLoads : YES
    NSIncludesSubdomains : YES
  2. Build Phases中Link Binary With Libraries,找到UserNotifications.framework 状态改为 Optional

手动配置Android

  1. 在 ../android/app/src/main/java/com/***/MainApplication.java 中添加
    public class MainApplication extends Application implements 
    ReactApplication `中添加
    private boolean SHUTDOWN_TOAST = false;
    private boolean SHUTDOWN_LOG = false;
    protected List<ReactPackage> getPackages()中添加
    new JPushPackage(SHUTDOWN_TOAST, SHUTDOWN_LOG)```
    最后一行不许有逗号
    
  2. 在 ../android/app/build.gradle中修改
  ...
  defaultConfig{
      applicationId "<yourBundleID>" // 修改为极光推送中android应用包名
      ...
      manifestPlaceholders = [ // 添加
          JPUSH_APPKEY: "<yourAPPKEY>", // 极光推送中应用AppKey  
          APP_CHANNEL: "developer-dange"  //下载渠道  
      ]
  }
 }
  1. 修改 MainActivety.java 中的包名,改为BundleID;
  2. 修改MainApplication.java 中的包名,改为BundleID;
  3. 修改AndroidManifest.xml中的包名,改为BundleID;
  4. 根据包名修改文件关系

作者介绍

安徽安大笃北信息科技有限责任公司 端工程师 DAN 花名:太子 QQ:542168513

相关文章

  • React-Native极光推送双端配置

    开发步骤 安装WebStorm,激活使用 安装node到默认位置 配置npm的镜像资源(国内访问 npm安装yar...

  • Android极光推送集成以及极光验证码Demo

    极光推送以及极光验证码 极光推送 配置 主要特点 产品功能说明 客户端维持连接占用资源少、耗电低SDK丰富的接口,...

  • iOS极光推送项目的配制

    1、登陆极光推送 2、添加项目 3、进行下面两项的设置 此时极光推送ios端的推送就配置好了,接下来就是项目里的极...

  • 极光推送(二)——推送的使用

    前言 在极光推送(一)——配置中讲过了极光推送的配置,这节讲讲极光推送的使用参考文档极光官网 下面以我写的demo...

  • 环信消息推送

    一,关于推送 之前做过 极光 APNS 个推的 推送 : 这里说下 极光推送是比较 适合用在 iOS 端和 安卓端...

  • 极光统计

    前言 极光统计可以独立使用,其配置和极光推送相似 极光统计配置 极光统计代码编写 极光统计方法调用 具体配置请参考...

  • 极光推送进行远程推送

    借阅:极光推送进行远程推送 怎么使用极光推送进行远程推送 在极光官网注册极光推送创建一个应用在应用配置中导入两个证...

  • iOS 极光推送诶配置成功却收不到推送消息的处理

    极光配置都OK了,推送能力打开了,Apple的推送证书也配置了,极光后台的推送证书也验证成功了,推送也打印了log...

  • iOS-iOS10极光推送的使用

    1、首先先配置好推送证书,传到极光。极光推送->iOS证书设置指南极光推送->iOS SDK集成指南(XCode8...

  • iOS-极光推送的使用

    1、首先先配置好推送证书,传到极光。极光推送->iOS证书设置指南极光推送->iOS SDK集成指南(XCode8...

网友评论

  • 向前Hell:更新了一下链接,MD文件直接拷过来,都乱了

本文标题:React-Native极光推送双端配置

本文链接:https://www.haomeiwen.com/subject/ujdkixtx.html