[react native / 리액트 네이티브] react-native-push-notification 사용법

설치방법

https://gaebarsaebal.tistory.com/20

[react native / 리액트 네이티브] react-native-push-notification IOS, Android 푸시 알람 설치하기

공식 github

https://github.com/zo0r/react-native-push-notification

GitHub - zo0r/react-native-push-notification: React Native Local and Remote Notifications

 

pushNotification

pushNotification을 사용하기 위해서는 일단 채널을 만들어 줘야 한다

 

channeID(필수):  문자열 형식이어야 하며 시스템 내에서 고유해야 한다.

channelName(필수): 문자열 형식으로 입력하며, 이 이름은 사용자의 알림 설정에서 보여집니다.

import PushNotification, {Importance} from 'react-native-push-notification';
...
  PushNotification.createChannel(
    {
      channelId: "channel-id", // (required)
      channelName: "My channel", // (required)
      channelDescription: "A channel to categorise your notifications", // (optional) default: undefined.
      playSound: false, // (optional) default: true
      soundName: "default", // (optional) See `soundName` parameter of `localNotification` function
      importance: Importance.HIGH, // (optional) default: Importance.HIGH. Int value of the Android notification importance
      vibrate: true, // (optional) default: true. Creates the default vibration pattern if true.
    },
    (created) => console.log(`createChannel returned '${created}'`) // (optional) callback returns whether the channel was created, false means it already existed.
  );

 

 

채널을 만들었으면 이제 본격적으로 메시지와 시간을 설정해 줘야 한다.

 

아래처럼 두 가지 옵션이 있는데 첫 번째는 그냥 푸시 알람을 보내는 것이고 두 번째는 내가 원하는 시간에 알람을 보내는 푸시 알람이다.

나는 사용자가 원하는 시간에 알람을 보내야 하므로 후자를 선택했다.

 

PushNotification.localNotification

PushNotification.localNotificationSchedule

 

60초 후에 message라는 내용의 푸시 알람이 온다.

알람을 해당 시간에 매일 반복하고 싶으면 repeatType: day 옵션을 넣어준다.

PushNotification.localNotificationSchedule({
    channelId: "channelId",
    id: "id" 	//나중에 알람 삭제를 위해 필요
    message: "message",
    date: new Date(Date.now() + 60 * 1000), //  60초 후에 푸시 알람을 보냄
    // repeatType: 'day', // 매일 반복
  });

 

저 같은 경우 id는

id: Math.floor(Date.now() / 1000000) 로 값을 설정해 줬다. 처음엔 Date.now() 값으로 설정해 줬는데 값이 너무 커서 푸시 알람이 울리지 않아서 1000000으로 나누어 준 다음 소수점을 잘라서 정수로 사용해 줬다.