React Native 통합 jpush-react-native 예제 코드

jpush-react-native 는 극광 푸 시 공식 유지보수 플러그 인 입 니 다.github 주소:https://github.com/jpush/jpush-react-native
수 동 설정
1.프로젝트 에 플러그 인 통합

npm install jpush-react-native --save
rnpm link jpush-react-native

Android
android Studio import 를 사용 하여 react Native 응용 프로그램(React Native 응용 프로그램 이 있 는 디 렉 터 리 에 있 는 android 폴 더 를 선택 하면 됩 니 다)
안 드 로 이 드 프로젝트 의 settings.gradle 설정 수정:settings.gradle

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

app 의 AndroidManifest 설정 을 수정 하고 jpush 와 관련 된 설정 을 이 파일 에 복사 합 니 다.demo 의 AndroidManifest:(부분 추가)를 참고 하 십시오.
your react native project/android/app/AndroidManifest.xml

<application
  android:name=".MainApplication"
  android:allowBackup="true"
  android:icon="@drawable/ic_launcher"
  android:label="@string/app_name"
  android:theme="@style/AppTheme">
  <activity
   android:name=".MainActivity"
   android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
   android:label="@string/app_name">
   <intent-filter>
    <action android:name="android.intent.action.MAIN" />
    <category android:name="android.intent.category.LAUNCHER" />
   </intent-filter>
  </activity>

  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />

  <!-- Required . Enable it you can get statistics data with channel -->
  <meta-data android:name="JPUSH_CHANNEL" android:value="${APP_CHANNEL}"/>
  <meta-data android:name="JPUSH_APPKEY" android:value="${JPUSH_APPKEY}"/>

 </application>

app 의 build.gradle 설정 수정:your react native procject/android/app/build.gradle
app 의 build.gradle 설정 수정:

your react native project/android/app/build.gradle
android {
 defaultConfig {
  applicationId "yourApplicationId"
  ...
  manifestPlaceholders = [
    JPUSH_APPKEY: "yourAppKey", //      APPKey
    APP_CHANNEL: "developer-default" //     
  ]
 }
}
...
dependencies {
 compile fileTree(dir: "libs", include: ["*.jar"])
 compile project(':jpush-react-native')
 compile "com.facebook.react:react-native:+" // From node_modules
}

이 곳 의 yourApplicationId 를 프로젝트 의 패키지 이름 으로 바 꾸 기;yourAppKey 는 당신 이 인터넷 에서 신청 한 응용 프로그램의 AppKey 로 바 꿉 니 다.
이제 항목 을 다시 동기 화하 면 jpush-react-native 가 안 드 로 이 드 라 이브 러 리 프로젝트 로 안내 되 는 것 을 볼 수 있 을 것 입 니 다.
중요 한 것 은 제 가 이곳 에서 하루 동안 카드 를 걸 었 습 니 다.상기 코드 설정 이 완 료 된 후에 아무리 해도 푸 시 를 받 지 못 했 습 니 다.
해결 방안:프로젝트 찾기/nodemodules/jpush-react-native/android/src/main/android Manifest.xml,안에 있 는${applicationId}을 모두 프로젝트 패키지 이름 으로 바 꿉 니 다.
여기까지 안 드 로 이 드 설정 이 끝 났 습 니 다.
2.iOS 설정
ios 프로젝트 를 엽 니 다.rnpm link 이후 RCTJPushModule.xcodeproj 프로젝트 는 Libraries 디 렉 터 리 에 자동 으로 추 가 됩 니 다.
iOS 프로젝트 target 의 Build Phases->Link Binary with Libraries 에 다음 라 이브 러 리 를 추가 합 니 다.

CFNetwork.framework
CoreFoundation.framework
CoreTelephony.framework
SystemConfiguration.framework
CoreGraphics.framework
Foundation.framework
UIKit.framework
Security.framework
libz.tbd (Xcode7     libz.dylib)
UserNotifications.framework (Xcode8   )
libresolv.tbd (JPush 2.2.0       , Xcode7     libresolv.dylib)

도 메 인 이름 에 따라 info.plist 설정:
필요 한 지원 도 메 인 을 oNSException Domains 에 추가 합 니 다.그 중에서 jpush.cn 은 Key 로 서 사전 형식 입 니 다.
각 도 메 인 아래 에 두 개의 속성 을 설정 해 야 합 니 다:NSIncludes Subdomains,NSException Allows InsecureHTTPLoads.
두 속성 은 모두 Boolean 유형 이 고 값 은 각각 YES,YES 이다.
그림 과 같다

AppDelegate.h 파일 에 다음 코드 를 입력 하 십시오.여기 appkey,channel,isProduction 은 자신의 코드 를 입력 하 십시오.
static NSString *appKey = @”“; //appkey 작성
static NSString *channel = @”“; //채널 을 쓰 면 보통 nil 입 니 다.
static BOOL isProduction = false; //isProdurion 평소 테스트 시 false,생산 시 true 작성
AppDelegate.m 에 다음 코드 를 추가 합 니 다.
1.의존 파일 도입

 #import <RCTJPushModule.h>
 #ifdef NSFoundationVersionNumber_iOS_9_x_Max
 #import <UserNotifications/UserNotifications.h>
 #endif

 @interface AppDelegate()

 @end

2.didFinishLaunching With Options 방법 에 추가

if ([[UIDevice currentDevice].systemVersion floatValue] >= 10.0) {

 JPUSHRegisterEntity * entity = [[JPUSHRegisterEntity alloc] init];

 entity.types = UNAuthorizationOptionAlert|UNAuthorizationOptionBadge|UNAuthorizationOptionSound;

 [JPUSHService registerForRemoteNotificationConfig:entity delegate:self];

 }else if ([[UIDevice currentDevice].systemVersion floatValue] >= 8.0) {

 //       categories
 [JPUSHService registerForRemoteNotificationTypes:(UNAuthorizationOptionBadge |
              UNAuthorizationOptionSound |
              UNAuthorizationOptionAlert)
           categories:nil];
 }else {

 //categories    nil
 [JPUSHService registerForRemoteNotificationTypes:(UNAuthorizationOptionBadge |
              UNAuthorizationOptionSound |
              UNAuthorizationOptionAlert)
           categories:nil];
 }

 [JPUSHService setupWithOption:launchOptions appKey:appKey
      channel:nil apsForProduction:isProduction];

3.jpush 코드 추가

- (void)application:(UIApplication *)application

didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken {

 [JPUSHService registerDeviceToken:deviceToken];

}

- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo {

 //    APNs       

 [[NSNotificationCenter defaultCenter] postNotificationName:kJPFDidReceiveRemoteNotification object:userInfo];

}

이 방법 은 icon 커서 를 제거 하 는 것 입 니 다.

- (void)applicationWillEnterForeground:(UIApplication *)application {
 [application setApplicationIconBadgeNumber:0];
// [application cancelAllLocalNotifications];
}

//iOS 7 Remote Notification

- (void)application:(UIApplication *)application didReceiveRemoteNotification: (NSDictionary *)userInfo fetchCompletionHandler:(void (^) (UIBackgroundFetchResult))completionHandler {

 [[NSNotificationCenter defaultCenter] postNotificationName:kJPFDidReceiveRemoteNotification object:userInfo];

}

// iOS 10 Support

- (void)jpushNotificationCenter:(UNUserNotificationCenter *)center willPresentNotification:(UNNotification *)notification withCompletionHandler:(void (^)(NSInteger))completionHandler {

 // Required

 NSDictionary * userInfo = notification.request.content.userInfo;

 if([notification.request.trigger isKindOfClass:[UNPushNotificationTrigger class]]) {

 [JPUSHService handleRemoteNotification:userInfo];

 [[NSNotificationCenter defaultCenter] postNotificationName:kJPFDidReceiveRemoteNotification object:userInfo];

 }

 completionHandler(UNNotificationPresentationOptionAlert); //         ，        ， Badge、Sound、Alert          

}

// iOS 10 Support

- (void)jpushNotificationCenter:(UNUserNotificationCenter *)center didReceiveNotificationResponse:(UNNotificationResponse *)response withCompletionHandler:(void (^)())completionHandler {

 // Required

 NSDictionary * userInfo = response.notification.request.content.userInfo;

 if([response.notification.request.trigger isKindOfClass:[UNPushNotificationTrigger class]]) {

 [JPUSHService handleRemoteNotification:userInfo];

 [[NSNotificationCenter defaultCenter] postNotificationName:kJPFDidReceiveRemoteNotification object:userInfo];

 }

 completionHandler(); //           

}

 - (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error {

 //Optional

 NSLog(@"did Fail To Register For Remote Notifications With Error: %@", error);

}

사용자 정의 메 시 지 를 가 져 오 려 면 didFinishLaunching With Options 방법 에 코드 를 추가 해 야 합 니 다.

//       
 NSNotificationCenter *defaultCenter = [NSNotificationCenter defaultCenter];

 [defaultCenter addObserver:self selector:@selector(networkDidReceiveMess

사용자 정의 메 시 지 를 감청 하기 위해 새로운 방법 을 추가 해 야 합 니 다.

//#pragma mark          

- (void)networkDidReceiveMessage:(NSNotification *)notification {

 NSDictionary * userInfo = [notification userInfo];

 NSString *content = [userInfo valueForKey:@"content"];

 NSDictionary *extras = [userInfo valueForKey:@"extras"];

 NSString *customizeField1 = [extras valueForKey:@"123456"]; //     ，key      

 NSLog(@"   message:%@",userInfo);

 NSLog(@" %@",content);

 NSLog(@" %@",extras);

 NSLog(@" %@",customizeField1);

}

 코드 설정,Xcode 에서 push 권한 열기

아래로 미 끄 러 짐,설정:

여기까지 ios 설정 이 끝 났 습 니 다.
그리고 RN 에서 jpush 를 호출 할 코드 를 설정 합 니 다.

import JPushModule from 'jpush-react-native';
 
constructor(props) {
  super(props);
  if(Platform.OS === 'android') JPushModule.initPush();
 }
componentDidMount(){
  if (Platform.OS === 'android') {
   BackAndroid.addEventListener('hardwareBackPress', this._onBackAndroid);

   //-----------jpush android start
   // JPushModule.getInfo((map) => {
   //  console.log(map);
   // });
   // JPushModule.addReceiveCustomMsgListener((message) => {
   // });
   JPushModule.addReceiveNotificationListener((message) => {
    console.log("receive notification: ");
    console.log(message);
   });
   JPushModule.addReceiveOpenNotificationListener((map) => {

    console.log("Opening notification!");
    console.log(map);
   });
   //-----------jpush android end
  }


  //-----------jpush ios start
  if (Platform.OS === 'ios') {
   this.subscription = NativeAppEventEmitter.addListener(
    'ReceiveNotification',
    (notification) => {
     console.log('-------------------    ----------------');
     console.log(notification)
    }
   );
  }
  //-----------jpush ios end
 }

 componentWillUnmount(){
  if (Platform.OS === 'android') {
   BackAndroid.removeEventListener('hardwareBackPress', this._onBackAndroid);
  }
  JPushModule.removeReceiveCustomMsgListener();
  JPushModule.removeReceiveNotificationListener();
  this.subscription && this.subscription.remove();
 }

 그리고 공식 콘 솔 에 가서 수 동 으로 알림 을 보 낼 수 있 습 니 다.
아이콘 오른쪽 상단 에 표 시 된 숫자 를 증가 시 키 려 면 그림 과 같 습 니 다.

영어 로 된
여러분 이 집성 할 때 공식 문 서 를 많이 보고 양쪽 의 공식 demo 를 다운로드 하면 유용 한 정 보 를 많이 발견 할 수 있 습 니 다.
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.