제목: 내 React Native 앱에 푸시 알림을 통합하고 수신된 푸시 알림을 Freshchat SDK로 보내는 방법 이미지: 0개 Android 1. Firebase 설정 애플리케이션에 대한 Firebase 계정이 있는 경우 이 단계를 건너뛸 수 있습니다. 애플리케이션에 대한 Firebase 계정이 없는 경우 https://firebase.google.com/docs/android/setup를 참조하여 계정을 만드십시오. 2. Freshchat FCM 키 구성 Firebase 콘솔에서 프로젝트 아래의 클라우드 메시징 탭으로 이동하여 서버 키를 확인하고 복사하십시오. Freshchat 웹 포털에서 Admin > Mobile SDK 아래에 서버 키를 붙여넣으십시오. 3. Android 프로젝트를 Firebase에 추가 Firebase에 Android 앱 추가를 클릭하고 설정 단계를 따르십시오. 기존 Google 프로젝트를 가져오는 경우 자동으로 진행될 수 있으며 구성 파일을 다운로드하면 됩니다. 요청 시 앱의 패키지 이름을 입력하십시오. 앱이 사용하는 패키지 이름을 입력하는 것이 중요합니다. 이는 Firebase 프로젝트에 앱을 추가할 때만 설정할 수 있습니다. 이 과정에서 google-services.json 파일을 다운로드하게 됩니다. 이 파일은 언제든지 다시 다운로드할 수 있습니다. 루트 수준의 build.gradle 파일에 규칙을 추가하여 google-services 플러그인과 Google의 Maven 저장소를 포함하십시오. ```gradle buildscript { // ... dependencies { // ... classpath 'com.google.gms:google-services:4.2.0' // google-services 플러그인 } } allprojects { // ... repositories { // ... google() // Google's Maven 저장소 } } ``` v. 그런 다음, 모듈 Gradle 파일(일반적으로 app/build.gradle)에서 파일 하단에 apply plugin 줄을 추가하여 Gradle 플러그인을 활성화하십시오. ```gradle apply plugin: 'com.android.application' android { // ... } dependencies { // ... implementation 'com.google.firebase:firebase-core:16.0.6' // "Could not find" 오류가 발생합니까? 루트 build.gradle에 Google maven 저장소를 추가했는지 확인하십시오. } // 이 부분을 하단에 추가하십시오 apply plugin: 'com.google.gms.google-services' ``` 초기화 코드를 추가한 후 앱을 실행하여 Firebase 콘솔에 Firebase가 성공적으로 설치되었음을 확인하십시오. 4. 푸시 토큰 수신 FirebaseMessagingService.java를 생성해야 합니다. FirebaseMessagingService를 사용하려면 앱 매니페스트에 다음 코드를 추가해야 합니다. ```xml ``` 푸시 토큰은 FirebaseMessagingService 클래스의 onNewToken 함수에서 수신됩니다. 자세한 내용은 https://firebase.google.com/docs/cloud-messaging/android/client#monitor-token-generation를 참조하십시오. 푸시 토큰을 수신하면 아래 스니펫을 사용하여 Freshchat에 전달할 수 있습니다. ```java Freshchat.getInstance(context).setPushRegistrationToken(token); ``` 5. 푸시 알림 수신 및 React Native Freshchat SDK로 전달 FirebaseMessagingService의 onMessageReceived() 메서드를 재정의하여 푸시 알림 페이로드에 액세스할 수 있습니다. 수신된 페이로드를 React Native Freshchat SDK로 전달하려면 아래 스니펫을 사용하십시오. FirebaseMessagingService.java에 추가하십시오. ```java package com.example.hotlineapp; import com.freshchat.consumer.sdk.Freshchat; import com.google.firebase.messaging.FirebaseMessagingService; import com.google.firebase.messaging.RemoteMessage; public class MyFirebaseMessagingService extends FirebaseMessagingService { @Override public void onMessageReceived(RemoteMessage remoteMessage) { if (Freshchat.isFreshchatNotification(remoteMessage)) { Freshchat.handleFcmMessage(this, remoteMessage); } } } ``` 참고: Freshchat 네이티브 SDK는 React Native Freshchat SDK의 일부이므로 "com.freshchat.consumer.sdk.Freshchat"이 빨간색으로 표시될 수 있습니다(클래스 오류를 해결할 수 없음). 그러나 이러한 클래스는 빌드 생성 시 추가됩니다. iOS 1. 푸시 알림 p12 인증서 생성 및 Freshchat에 업로드 https://support.freshchat.com/support/solutions/articles/232534를 참조하십시오. 2. 푸시 알림 기능 활성화 Xcode 프로젝트의 기능 섹션으로 이동하여 푸시 알림 기능을 활성화하십시오. 3. UserNotifications 프레임워크 설정 i. Appdelegate 클래스 내에서 UserNotifications 프레임워크를 가져오십시오. ii. Appdelegate 클래스가 UNUserNotificationCenterDelegate 프로토콜을 준수하도록 하고 다음 코드를 추가하십시오. ```swift application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions [UIApplicationLaunchOptionsKey: Any]?) -> Bool function, UNUserNotificationCenter.current().delegate = self UNUserNotificationCenter.current().requestAuthorization(options:[.badge, .alert, .sound]){ (granted, error) in } UIApplication.shared.registerForRemoteNotifications() ``` iii. Appdelegate 클래스에서 UNUserNotificationCenterDelegate 프로토콜의 다음 메서드를 구현하십시오.// 푸시 알림 클릭 이벤트를 처리하기 위한 함수입니다. * func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) // 기기에서 생성된 디바이스 토큰을 전달하기 위한 함수입니다. 4. 디바이스 토큰을 Freshchat에 전달하기 사용자가 푸시 알림에 대한 권한을 부여한 후 실행되는 다음 함수를 통해 디바이스 토큰을 Freshchat SDK에 전달합니다. func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) { Freshchat.sharedInstance().setPushRegistrationToken(deviceToken) } 5. 앱이 종료된 상태에서 푸시 알림 클릭 처리 application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool 함수 아래에 다음 줄을 추가합니다. if Freshchat.sharedInstance().isFreshchatNotification(launchOptions) { Freshchat.sharedInstance().handleRemoteNotification(launchOptions, andAppstate: application.applicationState) } 먼저 알림이 Freshchat에서 온 것인지 확인하고, 맞다면 handleRemoteNotification 함수를 호출하여 Freshchat SDK에 세부 정보를 전달합니다. 6. 앱이 실행 중인 상태에서 푸시 알림 클릭 처리 앱이 실행 중일 때 푸시 알림 클릭을 처리하기 위해 다음 코드를 추가합니다. func userNotificationCenter(_ center: UNUserNotificationCenter, didReceive response: UNNotificationResponse, withCompletionHandler completionHandler: @escaping () -> Void) { let dictionary = response.notification.request.content.userInfo let appstate = UIApplication.shared.applicationState if Freshchat.sharedInstance().isFreshchatNotification(dictionary) { Freshchat.sharedInstance().handleRemoteNotification(dictionary, andAppstate: appstate) } }