安裝

‘npm install jpush-react-native jcore-react-native --save’

配置

1.自動配置

react-native link 

根據(jù)提示，輸入 appKey 等即可。

自動配置完成后，需檢查是否配置正確，具體請看手動配置內容

2.手動配置

Ios

在 iOS 工程中設置 TARGETS-> BUILD Phases -> LinkBinary with Libraries 找到 UserNotifications.framework 把 status 設為 optional

在 iOS 工程中如果找不到頭文件可能要在 TARGETS-> BUILD SETTINGS -> Search Paths -> Header Search Paths 添加如下路徑

$(SRCROOT)/../node_modules/jpush-react-native/ios/RCTJPushModule

在 xcode8 之后需要點開推送選項： TARGETS -> Capabilities -> Push Notification 設為 on 狀態(tài)

Android

檢查一下 dependencies 中有沒有添加 jpush-react-native 及 jcore-react-native 這兩個依賴。

your react native project/android/app/build.gradle

...

dependencies {

  compile fileTree(dir: "libs", include: ["*.jar"])
  compile project(':jpush-react-native')  // 添加 jpush 依賴
  compile project(':jcore-react-native')  // 添加 jcore 依賴
  compile "com.facebook.react:react-native:+"  // From node_modules

}

檢查 android 項目下的 settings.gradle 配置有沒有包含以下內容：

settings.gradle

include ':app', ':jpush-react-native', ':jcore-react-native'
project(':jpush-react-native').projectDir = new File(rootProject.projectDir,'../node_modules/jpush-react-native/android')
project(':jcore-react-native').projectDir = new File(rootProject.projectDir,'../node_modules/jcore-react-native/android')

檢查一下 app 下的 AndroidManifest 配置，有沒有增加 部分。

your react native project/android/app/AndroidManifest.xml

image

現(xiàn)在重新 sync 一下項目，應該能看到 jpush-react-native 以及 jcore-react-native 作為 android Library 項目導進來了。

RN 0.29.0 以下版本

打開 app 下的 MainActivity，在 ReactInstanceManager 的 build 方法中加入 JPushPackage：

app/MainActivity.java

RN 0.29.0 以上版本

打開 app 下的 MainApplication.java 文件，然后加入 JPushPackage

app/MainApplication.java

image

import cn.jpush.reactnativejpush.JPushPackage;   // <--   導入 JPushPackage
  public class MainApplication extends Application implements ReactApplication {
   // 設置為 true 將不會彈出 toast
   private boolean SHUTDOWN_TOAST = false;
   // 設置為 true 將不會打印 log
   private boolean SHUTDOWN_LOG = false;
   private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {

        @Override

        public boolean getUseDeveloperSupport() {
            return BuildConfig.DEBUG;
        }

        @Override

        protected String getJSMainModuleName() {         // rn 0.49 后修改入口為 index
           return "index";
        }

        @Override

        protected List getPackages() {
            return Arrays.asList(
                    new MainReactPackage(),
                    new JPushPackage(SHUTDOWN_TOAST, SHUTDOWN_LOG)   //  <-- 添加 JPushPackage
            );
        }
    };

  @Override

  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }

  @Override

  public void onCreate() {
    super.onCreate();
    SoLoader.init(this, /* native exopackage */ false);
  }
}

import JPushModule 
import JPushModule from 'jpush-react-native';

...

// example

componentDidMount() {
   JPushModule.notifyJSDidLoad();
   JPushModule.addReceiveCustomMsgListener((message) => {
      this.setState({pushMsg: message});
    });
    JPushModule.addReceiveNotificationListener((message) => {
      console.log("receive notification: " + message);
    })
  }

  componentWillUnmount() {
    JPushModule.removeReceiveCustomMsgListener();
    JPushModule.removeReceiveNotificationListener();
  }