728x90

>>> RNFirebase 백그라운드 알림이 왜 수신이 안돼?

>>> RNFirebase 아이콘이 왜 안나와?

 

[ 푸시알림 완벽구현 - 최종판 ]

https://honeystorage.tistory.com/306

 

 

푸시 알림이

ㄱ) foreground

ㄴ) background

ㄷ) quit state

에서 모두 정상적으로 수신되는것을

분명히 확인했었다

 

라고 착각을 하고있었는데

앱 배포 직전

검토 과정에서

iOS에 알림이 수신은 되지만

진동이 울리지 않음을 발견하였다.

 

위 문제를 해결하기 위해

아래와 같은 방법으로 접근하였다.

 

1. 내가 설정을 덜 한것은 없는지

2. rnfirebase, github에 올라온 issues중에 같은 내용은 없는지

3. vibration 기능의 접근 권한이 문제인지

4. setBackgounrMessageHandler 수신 부분이 문제인지

5. 푸시 발송관련 서버 코드에 문제가 있는것인지

 

1. 내가 설정을 덜 한것은 없는지

rnfirebase docs를 통해 체크한 결과

headless 상태에 대한 처리가 미흡해 보였다.

// index.js
import { AppRegistry } from 'react-native';
import messaging from '@react-native-firebase/messaging';

messaging().setBackgroundMessageHandler(async remoteMessage => {
  console.log('Message handled in the background!', remoteMessage);
});

messaging()
  .getIsHeadless()
  .then(isHeadless => {
    // do sth with isHeadless
  });
  
function HeadlessCheck({ isHeadless }) {
  if (isHeadless) {
    // App has been launched in the background by iOS, ignore
    return null;
  }

  return <App />;
}

function App() {
  // Your application
}

AppRegistry.registerComponent('app', () => HeadlessCheck);
// appDelegate.m

// add this import statement at the top of your `AppDelegate.m` file
#import "RNFBMessagingModule.h"

// in "(BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions" method
// Use `addCustomPropsToUserProps` to pass in props for initialization of your app
// Or pass in `nil` if you have none as per below example
// For `withLaunchOptions` please pass in `launchOptions` object
NSDictionary *appProperties = [RNFBMessagingModule addCustomPropsToUserProps:nil withLaunchOptions:launchOptions];

// Find the `RCTRootView` instance and update the `initialProperties` with your `appProperties` instance
RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
                                             moduleName:@"nameOfYourApp"
                                             initialProperties:appProperties];

위 세가지 설정들에 대해서 다시 한번

검토를 하였다.

 

2. rnfirebase, github에 올라온 issues중에 같은 내용은 없는지

제법 많은 비슷한 내용들이 있었다.

그 중에서 내가 찾은 솔루션은

https://github.com/invertase/react-native-firebase/issues/5656

위의 방법인데

이것은  3,4,5의 과정을 걸쳐서 찾은 솔루션이다.

 

3. vibration 기능의 접근 권한이 문제인지

react-native에 vibration이라는 기능이 내포되어있다.

이 마저도 해보려고하니 잘못된 정보들이 너무나도 많았다.

임시 버튼을 만들어

기능이 잘 동작하는지만 확인하였다.

import { Platform, Vibration } from 'react-native';

// test code
const umm = () => {
  Platform.OS === 'ios' && Vibration.vibrate([400]);
}

 

4. setBackgounrdMessageHandler 수신 부분이 문제인지

화면을 열어보면 푸시가 와있어서

setBackgounrdMessageHandler 리스너에

문제가 있으리라고는 생각해보지 않았었다.

 

하지만, 디바이스에서는 수신했더라도

앱 내에 setBackgounrdMessageHandler 리스너가

실제로 잘 동작하고 있는지는 검토해볼 필요가 있었다.

messaging().setBackgroundMessageHandler(async remoteMessage => {
  umm(); // vibration
  console.log('Message handled in the background!', remoteMessage);
});

const umm = () => {
  Platform.OS === 'ios' && Vibration.vibrate([400]);
}

 

위와 같이 임시 코드를 작성해서

진동이 오는지 체크해본 결과

위의 리스너가 제대로 동작하고 있지 않음을 발견했다.

 

리스너가 제대로 동작하지 않는다면

설정의 문제 혹은 발송의 문제

둘중에 하나라고 결론을 냈다.

 

그런데 아까 분명히

설정의 문제는 확인을 완료했다.

그러면 발송의 문제일 것이다.

 

5. 푸시 발송관련 서버 코드에 문제가 있는것인지

2번에서 언급했던

https://github.com/invertase/react-native-firebase/issues/5656

위의 링크에서 알맞는 발송 포맷을 발견했다.

 

추후, 가이드를 다시보니 업데이트가 된것인지

위 github 링크와 동일한 내용으로 발송 포맷이 나와있었다.

 

github 마지막 코멘트 업데이트 일자가

patels9-vf commented 7 hours ago

겨우 7시간전이 아닌가...

위 이슈가 최근까지도 이어지고있었나보다.

 

공식 가이드에서는

아래와 같이 푸시메시지를 발송하라고 한다.

admin.messaging().send({
  data: {
    //some data
  },
  apns: {
    payload: {
      aps: {
        contentAvailable: true,
      },
    },
    headers: {
      'apns-push-type': 'background',
      'apns-priority': '5',
      'apns-topic': '', // your app bundle identifier
    },
  },
  //must include token, topic, or condition
  //token: //device token
  //topic: //notification topic
  //condition: //notification condition
});

 

다만, 위의 메시지는

data-only에 해당하는 것이기도 하고

보다 많은 케이스에 대비하고자

github의 가이드를 따랐다.

 

const message: any = {
  token,
  notification: {
    title,
    body,
  },
  data: {
    title,
    body,
  },
  android: {
    priority: 'high',
    notification: {
      title,
      body,
      sound: 'default'
    }
  },
  apns: {
    headers: {
      'apns-priority': '5',
    },
    payload: {
      aps: {
        sound: 'default',
        // contentAvailable: 1,
        'content-available': 1,
      }
    }
  }
};
admin.messaging().send(message);

 

위 방법으로 문제없이 메시지가 수신됨을 확인하였다.

 

 

** 번외 **

나는 애플워치를 사용하는데

핸드폰에서 알림이 안울리고

계속 애플워치에서 알림이 울려서

블루투스를 끊고 핸드폰에서 알림이 오는지에 대한

확인이 필요하였다.

 

테스트 결과 수신은 됐다.

다만, 어느정도의 딜레이가 발생했다.

 

가이드에 따르면 priority 설정된

푸시 메시지는

8seconds 정도의 간격으로만

발송이 가능한듯하다.

 

 

>>> RNFirebase 백그라운드 알림이 왜 수신이 안돼?

>>> RNFirebase 아이콘이 왜 안나와?

 

[ 푸시알림 완벽구현 - 최종판 ]

https://honeystorage.tistory.com/306

728x90
반응형