구글 파이어베이스는 인증, 클라우드 메시지, 데이타베이스, 스토리지등 모바일 앱의 개발/품질/분석/성장을 위한 최상의 환경을 제공하는 클라우드 플랫폼입니다.
리액트-네이티브 환경에서도 구글 파이어베이스와 연동이 가능하며, 구글 파이어베이스에서 제공하는 다양한 기능을 손쉽게 모바일과 웹에 적용이 가능합니다.
푸시메시지 연동 (iOS 설정)
|
1 2 3 4 5 6 7 8 9 10 11 |
// AppDelegate.h // 패키지 임포트 (iOS) @import Firebase; @import UserNotifications; @interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate, UNUserNotificationCenterDelegate, FIRMessagingDelegate> @property (nonatomic, strong) UIWindow *window; @end |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
// AppDelegate.m #import "AppDelegate.h" #import "RNFirebaseNotifications.h" @implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { // Use Firebase library to configure APIs [self initializeFirebase]; RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions]; RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"AgnesApp" initialProperties:nil]; [AppCenterReactNative register]; [AppCenterReactNativeAnalytics registerWithInitiallyEnabled:true]; [AppCenterReactNativeCrashes registerWithAutomaticProcessing]; rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1]; self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds]; UIViewController *rootViewController = [UIViewController new]; rootViewController.view = rootView; self.window.rootViewController = rootViewController; [self.window makeKeyAndVisible]; return YES; } - (void)initializeFirebase { [FIRApp configure]; [RNFirebaseNotifications configure]; [FIRMessaging messaging].delegate = self; if ([UNUserNotificationCenter class] != nil) { // iOS 10 or later // For iOS 10 display notification (sent via APNS) [UNUserNotificationCenter currentNotificationCenter].delegate = self; UNAuthorizationOptions authOptions = UNAuthorizationOptionAlert | UNAuthorizationOptionSound | UNAuthorizationOptionBadge; [[UNUserNotificationCenter currentNotificationCenter] requestAuthorizationWithOptions:authOptions completionHandler:^(BOOL granted, NSError * _Nullable error) { }]; } else { // iOS 10 notifications aren't available; fall back to iOS 8-9 notifications. UIUserNotificationType allNotificationTypes = (UIUserNotificationTypeSound | UIUserNotificationTypeAlert | UIUserNotificationTypeBadge); UIUserNotificationSettings *settings = [UIUserNotificationSettings settingsForTypes:allNotificationTypes categories:nil]; [[UIApplication sharedApplication] registerUserNotificationSettings:settings]; } [[UIApplication sharedApplication] registerForRemoteNotifications]; } - (void) application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken { [FIRMessaging messaging].APNSToken = deviceToken; } @end |
리액트-네이티브 토큰 발급
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 |
import firebase from 'react-native-firebase'; export default class HomeScreen extends React.Component<Props, {estimation:number}> { ... ... ... async componentDidMount() { this._checkPermission(); } // 퍼미션 확인 async _checkPermission(){ const enabled = await firebase.messaging().hasPermission(); if (enabled) { // user has permissions this._updateTokenToServer(); } else { // user doesn't have permission this._requestPermission(); } } // 퍼미션 요청 async _requestPermission(){ try { // User has authorised await firebase.messaging().requestPermission(); await this._updateTokenToServer(); } catch (error) { // User has rejected permissions } } // 발행된 토큰을 내부 메모리에 저장 async _updateTokenToServer(){ const fcmToken = await firebase.messaging().getToken(); await StorageManager.getInstance().set("token", fcmToken); } } |