React Native FCM 구축 (1)

Firebase 설정

1. Firebase module 설치

- npm install --save @react-native-firebase/app

 

2. 자격 증명 발급

- Android

 · 프로젝트 내 android 폴더 진입 (cd android)

 · ./gradlew signingReport 실행

 · 여러 Variant 정보가 생성되는데, debug Variant의 SAH1를 복사하여 Firebase Project 생성 시 설정

   (SHA1은 선택이지만 Dynamic Link 등의 기능을 사용하기 위해서는 설정해야 함)

 · google-services.json 파일이 생성되면 파일을 /android/app에 이동

 

3. Firebase 설정

 · 프로젝트 레벨의 build.gradle 파일에 dependency 추가

buildscript {
  dependencies {
    // ... other dependencies
    classpath 'com.google.gms:google-services:4.3.3'
    // Add me --- /\
  }
}

 

 · 앱 레벨의 build.gradle 파일을 아래와 같이 추가

apply plugin: 'com.android.application'
apply plugin: 'com.google.gms.google-services' // <- Add this line

- iOS 

 · 생략

 

4. Autolinking & Rebuilding

 - RN 0.60+ 이상 버전부터는 자동으로 autolinking 되기 때문에 별도로 처리할 필요가 없음

 - RN 0.60 미만 버전은 아래와 같이 처리 필요

# Android apps
npx react-native run-android

# iOS apps
cd ios/
pod install --repo-update
cd ..
npx react-native run-ios

 

참고 : rnfirebase.io/

 

---

FCM 설정

FCM : Firebase 클라우드 메세징 (하루에 수십억 개 발송 가능, 250ms 내 전송 가능, 무료)

 

1. FCM module 설치

# Install & setup the app module
yarn add @react-native-firebase/app

# Install the messaging module
yarn add @react-native-firebase/messaging

# If you're developing your app using iOS, run this command
cd ios/ && pod install

2. 메시지 수신 

 - 메세지 수신을 위해 Device Instance Token 발급 과정이 필요.

   (토큰 발급 -> 토큰 값을 통한 알림 전송)

 - 메세지 수신의 경우 핸들러를 통해 처리됨. (onMessage(), setBackgroundMessageHandler())

 - 사용자 앱의 상태를 Foreground(활성화), Background(홈 키를 누르거나, 다른 앱을 실행 중일 경우), Quit(잠금 상태, 실행 중이지 않은 경우)로 분류한다고 했을 때 적용되는 핸들러가 다름

Status	Called
Foreground	onMessage()
Background	setBackgroundMessageHandler()
Quit	setBackgroundMessageHandler()

 - 백그라운드 핸들러 설정을 위해서 setBackgroundMessageHandler는 어플리케이션 단위 밖에서 빠르게 설정해 주어야 함. (index.js)

 

3. 메세지 발신

 3-1. Firebase console

      Firebase console(console.firebase.google.com/)에서 테스트 알림을 보낼 수 있음.

 

 3-2. Backend Server 

      HTTP Protocol을 이용해 FCM 서버와 통신하여 알림을 보낼 수 있음.

 

참고 : rnfirebase.io/messaging/usage