iOS 및 Android용 React 기본 로컬 및 원격 알림
이 저장소는 적극적으로 유지 관리되지 않습니다. 주된 이유는 시간이다. 두 번째는 아마도 iOS와 Android 모두에서 알림이 복잡하기 때문일 것입니다. 이 프로젝트에는 일부 문제를 해결하거나 새로운 기능을 구현하기 위해 대규모 리팩터링이 필요할 수 있습니다. 나는 아마도 다음과 같은 대안을 고려해야 한다고 생각합니다: 9월부터 Notifee가 무료이거나 반응 네이티브 알림입니다.
이 프로젝트의 관리자가 되는 데 관심이 있다면 언제든지 문제를 문의하세요.
CHANGELOG에서 변경 사항 및 마이그레이션을 확인하세요.
변경 내역
관리자를 환영합니다! 저에게 연락 주시기 바랍니다
변경 로그는 버전 3.1.3부터 여기에서 확인할 수 있습니다: 변경 로그
npm install --save react-native-push-notification
yarn add react-native-push-notification
참고: iOS를 대상으로 하는 경우 이 패키지가 iOS에 종속되므로 PushNotificationIOS 설치 지침도 따라야 합니다.
참고: Android의 경우 예약 알림을 사용하려면 AndroidManifest.xml(아래 참조)을 수동으로 업데이트해야 합니다.
문제가 있나요? 문제를 제기하기 전에 문제 해결 가이드를 읽어보세요.
읽어주세요...
구성 요소는 iOS 부분에 PushNotificationIOS를 사용합니다. 설치 지침을 따라야 합니다.
참고: 버전 15 이전의 firebase-messaging
빌드 시 및 런타임 시 올바르게 작동하려면 버전 번호가 동일해야 합니다. 특정 버전을 사용하려면:
android/build.gradle
에서
내선 { googlePlayServicesVersion = "<Play 서비스 버전>" // 기본값: "+"firebaseMessagingVersion = "<Firebase 버전>" // 기본값: "21.1.0"// 기타 설정compileSdkVersion = <컴파일 SDK 버전> // 기본값: 23buildToolsVersion = "<빌드 도구 버전>" // 기본값: "23.0.1"targetSdkVersion = <대상 SDK 버전> // 기본값: 23supportLibVersion = "<지원 lib 버전>" // 기본값: 23.1.1}
참고: localNotification()은 애플리케이션 부분을 변경하지 않고도 작동하는 반면, localNotificationSchedule()은 다음 변경 사항에서만 작동합니다.
android/app/src/main/AndroidManifest.xml
에서
..... <uses-permission android:name="android.permission.VIBRATE" /> <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/> <application ....><!-- 원격 알림 수신 시 포그라운드에서 팝업을 활성화하려면 값을 true로 변경합니다(로컬 알림을 표시하는 동안 중복을 방지하려면 false로 설정) --><meta-data android: name="com.dieam.reactnativepushnotification.notification_foreground"android:value="false"/><!-- 리소스 이름을 앱의 강조 색상 또는 원하는 다른 색상으로 변경하세요. --><meta-data android:name="com.dieam.reactnativepushnotification.notification_color"android:resource="@color/white"/> <!-- 표준 색상을 사용하려면 @android:color/{name} --><receiver android: name="com.dieam.reactnativepushnotification.modules.RNPushNotificationActions" /> <수신기 android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" /> <수신기 android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver"> <인텐트 필터> <액션 android:name="android.intent.action.BOOT_COMPLETED" /> <액션 android:name="android.intent.action.QUICKBOOT_POWERON" /> <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/> </의도-필터> </receiver> <serviceandroid:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"android:exported="false" > <인텐트 필터> <action android:name="com.google.firebase.MESSAGING_EVENT" /> </의도-필터> </service> .....
notification_color
meta-data
항목에 내장된 Android 색상( @android:color/{name}
)을 사용하지 않는 경우. android/app/src/main/res/values/colors.xml
에 있습니다(파일이 없으면 생성하세요).
<리소스> <color name="white">#FFF</color> </resources>
앱에 MainActivity.java
의 onNewIntent에 대한 @Override가 있는 경우 함수에 onNewIntent에 대한 슈퍼 호출이 포함되어 있는지 확인하세요( MainActivity.java
에 onNewIntent에 대한 @Override가 없으면 이 단계를 건너뛰세요).
@Overridepublic void onNewIntent(의도 의도) { ...super.onNewIntent(의도); ... }
Firebase 설정을 올바르게 설치했는지 확인하세요.
android/build.gradle
에서
빌드스크립트 {... 의존성 {... 클래스 경로('com.google.gms:google-services:4.3.3')... } }
android/app/build.gradle
에서
의존성 {... 구현 'com.google.firebase:firebase-analytics:17.3.0' ... } 플러그인 적용: 'com.google.gms.google-services'
그런 다음 google-services.json
을 android/app/
에 넣으세요.
참고: Firebase/출시 노트
Firebase Android 라이브러리
firebase-core
더 이상 필요하지 않습니다. 이 SDK에는 Google Analytics용 Firebase SDK가 포함되어 있습니다.이제 Analytics 또는 Analytics 사용을 권장하는 Firebase 제품(아래 표 참조)을 사용하려면 Analytics 종속성(
com.google.firebase:firebase-analytics:17.3.0
을 명시적으로 추가해야 합니다.
android/settings.gradle
에서
... include ':react-native-push-notification'project(':react-native-push-notification').projectDir = file('../node_modules/react-native-push-notification/android')
android/app/build.gradle
에서
의존성 {... 구현 프로젝트(':react-native-push-notification')... }
MainApplication.java
에 모듈을 수동으로 등록합니다( react-native link
사용하지 않은 경우).
import com.dieam.reactnativepushnotification.ReactNativePushNotificationPackage; // <--- 패키지 가져오기public 클래스 MainApplication 확장 애플리케이션 구현 ReactApplication { private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { @Override protected boolean getUseDeveloperSupport() {return BuildConfig.DEBUG; } @Override protected List<ReactPackage> getPackages() { return Arrays.<ReactPackage>asList( new MainReactPackage(), new ReactNativePushNotificationPackage() // <-- 패키지 추가 ); } }; .... }
구성 요소 내부, 심지어 App
내부에서도 .configure()
사용하지 마세요.
그렇게 하면 알림 핸들러가 로드되지 않기 때문에 실행되지 않습니다. 대신 앱의 첫 번째 파일(보통
index.js
에서.configure()
사용하세요.
"@react-native-community/push-notification-ios"에서 PushNotificationIOS 가져오기; "react-native-push-notification"에서 PushNotification 가져오기;// 구성 요소 LifeCycle(예: `comComponentDidMount`) 외부에 있어야 합니다.PushNotification. 구성({ // (선택사항) 토큰 생성 시 호출됨(iOS 및 Android) onRegister: 함수(토큰) {console.log("TOKEN:", 토큰); }, // (필수) 리모컨이 수신되거나 열리거나 로컬 알림이 열릴 때 호출됩니다. onNotification: 함수(알림) {console.log("NOTIFICATION:", 알림);// 알림 처리// (필수) 원격이 수신되거나 열리거나 로컬 알림이 열릴 때 호출됩니다notification.finish(PushNotificationIOS.FetchResult. 데이터 없음); }, // (선택 사항) 등록된 작업이 눌려지고 InvokeApp이 false일 때 호출됩니다. true인 경우 onNotification이 호출됩니다(Android) onAction: function (notification) {console.log("ACTION:",notification.action);console.log("NOTIFICATION:",notification);//작업 처리 }, // (선택 사항) 사용자가 원격 알림 등록에 실패하면 호출됩니다. 일반적으로 APNS에 문제가 있거나 장치가 시뮬레이터일 때 발생합니다. (iOS) onRegistrationError: 함수(err) {console.error(err.message, err); }, // IOS 전용 (선택): 기본값: all - 등록하기 위한 권한입니다. 권한: {경고: true,배지: true,소리: true, }, // 초기 알림이 자동으로 팝업되어야 하는지 // 기본값: 참 popInitialNotification: 사실, /** * (선택 사항) 기본값: true * - 권한(ios)과 토큰(android 및 ios)이 요청되는지 여부를 지정합니다. * - 그렇지 않은 경우 나중에 PushNotificationsHandler.requestPermissions()를 호출해야 합니다. * - 요청하지 않는 경우 원격 알림을 사용하거나 Firebase가 설치되어 있지 않은 경우 다음을 사용하세요. * requestPermissions: Platform.OS === 'ios' */ requestPermissions: true,});
예제 폴더에는 이 패키지를 사용하는 방법을 보여주는 예제 앱이 포함되어 있습니다. 알림 처리는 NotifService.js
에서 수행됩니다.
PR을 제출하기 전에 이 예시 앱으로 테스트해 보세요. 이 저장소를 유지하는 데 도움이 될 것입니다.
알림이 열리거나 수신되면 알림 데이터가 포함된 객체를 전달하는 onNotification
콜백이 호출됩니다.
알림 개체 예:
{foreground: false, // BOOLEAN: 알림이 포그라운드에서 수신된 경우 또는 notuserInteraction: false, // BOOLEAN: 사용자가 알림 영역에서 알림을 연 경우 또는 notmessage: '내 알림 메시지', // STRING: 알림 메시지데이터: {}, // 개체: 푸시 데이터 또는 로컬 알림에 정의된 userInfo}
PushNotification.localNotification(세부정보: 개체)
예:
PushNotification.localNotification({ /* Android 전용 속성 */ channelId: "your-channel-id", // (필수)channelId, 채널이 존재하지 않으면 알림이 트리거되지 않습니다. ticket: "내 알림 티커", // (선택 사항) showWhen: true, // (선택 사항) 기본값: true autoCancel: true, // (선택 사항) 기본값: true LargeIcon: "ic_launcher", // (선택 사항) 기본값: "ic_launcher". 큰 아이콘이 없으면 ""를 사용하세요. LargeIconUrl: "https://www.example.tld/picture.jpg", // (선택 사항) 기본값: 정의되지 않음 smallIcon: "ic_notification", // (선택 사항) 기본값: "ic_launcher"를 대체하는 "ic_notification". 기본 작은 아이콘에는 ""를 사용합니다. bigText: "알림이 확장될 때 표시될 내 큰 텍스트. HTML 태그를 사용하여 스타일을 지정할 수 있습니다(자세한 내용은 android 문서 참조).", // (선택 사항) 기본값: "message" prop subText: "이것은 하위 텍스트입니다.", // (선택 사항) 기본값: 없음 bigPictureUrl: "https://www.example.tld/picture.jpg", // (선택 사항) 기본값: 정의되지 않음 bigLargeIcon: "ic_launcher", // (선택 사항) 기본값: 정의되지 않음 bigLargeIconUrl: "https://www.example.tld/bigicon.jpg", // (선택 사항) 기본값: 정의되지 않음 color: "red", // (선택 사항) 기본값: 시스템 기본값 진동: true, // (선택 사항) 기본값: true 진동: 300, // 진동 길이(밀리초), vibrate=false인 경우 무시됨, 기본값: 1000 tag: "some_tag", // (선택 사항) 메시지에 태그 추가 group: "group", // (선택 사항) 메시지에 그룹 추가 groupSummary: false, // (선택 사항) 이 알림을 알림 그룹에 대한 그룹 요약으로 설정합니다. 기본값: false 진행 중: false, // (선택 사항) "진행 중인" 알림인지 여부를 설정합니다. 우선 순위: "높음", // (선택 사항) 알림 우선 순위 설정, 기본값: 높음 visible: "private", // (선택 사항) 알림 가시성 설정, 기본값: private ignoreInForeground: false, // (선택 사항) true인 경우 앱이 포그라운드에 있을 때 알림이 표시되지 않습니다(iOS 알림이 표시되는 방식과 패리티에 유용함). `com.dieam.reactnativepushnotification.notification_foreground` 설정과 결합하여 사용해야 합니다. shortcutId: "shortcut-id", // (선택 사항) 이 알림이 Launcher 바로가기와 중복되는 경우 Launcher가 바로가기를 숨기려는 경우에 대비해 바로가기의 ID를 설정합니다. 기본값은 정의되지 않았습니다. onlyAlertOnce: false, // (선택 사항) 경고는 소리 및 알림과 함께 한 번만 열립니다. 기본값: false when: null, // (선택 사항) 알림(일반적으로 이벤트가 발생한 시간)과 관련된 타임스탬프(밀리초 단위의 Unix 타임스탬프 값)를 추가합니다. Build.VERSION_CODES.N 이상을 대상으로 하는 앱의 경우 이 시간은 기본적으로 더 이상 표시되지 않으며 'showWhen'을 사용하여 선택해야 합니다. 기본값은 null입니다. useChronometer: false, // (선택 사항) `when` 필드를 스톱워치로 표시합니다. 알림은 '언제'를 타임스탬프로 표시하는 대신, 그 이후의 분과 초를 자동으로 업데이트하여 표시합니다. 경과 시간(예: 진행 중인 전화 통화)을 표시할 때 유용합니다. 기본값: false. timeoutAfter: null, // (선택 사항) 이 알림이 취소되어야 하는 기간을 밀리초 단위로 지정합니다(아직 취소되지 않은 경우). 기본값: null messageId: "google:message_id", // (선택 사항) 푸시 알림을 열면 @react-native-firebase/messaging 모듈에 저장된 데이터를 찾을 수 있도록 인텐트 추가 항목에 `message_id`로 추가됩니다. actions: ["Yes", "No"], // (Android에만 해당) 자세한 내용은 알림 작업 문서를 참조하세요. InvokeApp: true, // (선택 사항) 애플리케이션을 다시 포그라운드로 가져오거나 백그라운드에 유지하는 클릭 동작을 활성화합니다. 기본값: true /* iOS 전용 속성 */ 카테고리: "", // (선택 사항) 기본값: 빈 문자열 subtitle: "내 알림 부제목", // (선택 사항) 알림 제목 아래 작은 제목 /* iOS 및 Android 속성 */ id: 0, // (선택 사항) 문자열로 지정된 유효한 고유 32비트 정수입니다. 기본값: 자동 생성된 고유 ID title: "내 알림 제목", // (선택 사항) message: "내 알림 메시지", // (필수) picture: "https://www.example.tld/picture.jpg", // (선택 사항) Android용 별칭 `bigPictureUrl` 알림과 함께 사진을 표시합니다. 기본값: 정의되지 않음 userInfo: {}, // (선택 사항) 기본값: {}(null을 사용하면 JSON 값 '<null>' 오류 발생) playSound: false, // (선택 사항) 기본값: true soundName: "default", // (선택 사항) 알림이 표시될 때 재생할 사운드입니다. 'default' 값은 기본 사운드를 재생합니다. 'android.resource://com.xyz/raw/my_sound'와 같은 맞춤 사운드로 설정할 수 있습니다. 'res/raw' 디렉토리에서 'my_sound' 오디오 파일을 찾아 재생합니다. default: 'default'(기본 사운드가 재생됨) number: 10, // (선택 사항) 문자열로 지정된 유효한 32비트 정수입니다. 기본값: 없음(0일 수 없음) peatType: "day", // (선택사항) 반복 간격입니다. 자세한 내용은 '반복 알림' 섹션을 확인하세요.});
PushNotification.localNotificationSchedule(세부정보: 개체)
예:
PushNotification.localNotificationSchedule({ //... localNotifications의 모든 옵션을 사용할 수 있습니다. message: "내 알림 메시지", // (필수) date: new Date(Date.now() + 60 * 1000), // 60초 후 allowWhileIdle: false, // (선택 사항) 잠자기 중에 알림이 작동하도록 설정, 기본값: false /* Android 전용 속성 */ peatTime: 1, // (선택 사항) 구성된 반복 유형의 증분입니다. 자세한 내용은 '반복 알림' 섹션을 확인하세요.});
PushNotification.popInitialNotification(콜백)
예:
PushNotification.popInitialNotification((알림) => { console.log('초기 알림', 알림);});
Android에서는 사용자 정의 사운드 파일을 [project_root]/android/app/src/main/res/raw
에 추가합니다.
iOS에서는 xCode의 프로젝트 Resources
에 사용자 정의 사운드 파일을 추가합니다.
위치 알림 json에서 전체 파일 이름을 지정합니다.
soundName: 'my_sound.mp3'
채널을 사용하려면 시작 시 채널을 만들고 일치하는 channelId
PushNotification.localNotification
또는 PushNotification.localNotificationSchedule
에 전달하세요.
import PushNotification, {Importance} from 'react-native-push-notification';... PushNotification.createChannel({ ChannelId: "channel-id", // (필수) ChannelName: "내 채널", // (필수) ChannelDescription: "알림을 분류하는 채널", // (선택 사항) 기본값: 정의되지 않음 playSound: false, // (선택 사항) 기본값: true soundName: "default", // (선택 사항) 참조 `localNotification` 함수의 `soundName` 매개변수 중요도: Importance.HIGH, //(선택 사항) 기본값: Importance.HIGH Android 알림 중요도 vibrate: true, //(선택 사항) 기본값: true. true인 경우 패턴.},(created) => console.log(`createChannel return '${created}'`) // (선택 사항) 콜백은 채널이 생성되었는지 여부를 반환하고, false는 채널이 이미 존재했음을 의미합니다. );
참고: 채널이 없으면 알림이 작동하지 않습니다.
알림 옵션에서 channelId: "your-channel-id"
와 함께 채널 ID를 제공해야 합니다. 채널이 없으면 알림이 트리거되지 않을 수 있습니다. 채널이 생성되면 채널을 업데이트할 수 없습니다. 이러한 옵션을 변경하는 경우 channelId
다른지 확인하세요. 다른 방법으로 채널을 생성한 경우 해당 채널의 옵션이 적용됩니다.
원격 알림에 다른 기본 채널을 사용하려면 Firebase 설명서를 참조하세요.
Android에서 Firebase 클라우드 메시징 클라이언트 앱 설정
<meta-data android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="@string/default_notification_channel_id" />
로컬 알림의 경우 동일한 종류의 옵션을 사용할 수 있습니다.
당신은 사용할 수 있습니다 :
<meta-data android:name="com.dieam.reactnativepushnotification.default_notification_channel_id" android:value="@string/default_notification_channel_id" />
정의되지 않은 경우 AndroidManifest
에 정의된 Firebase 값으로 대체됩니다.
<meta-data android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="..." />
정의되지 않은 경우 기본 Firebase 채널 ID fcm_fallback_notification_channel
로 대체됩니다.
다음을 사용하여 사용 가능한 채널을 나열할 수 있습니다.
PushNotification.getChannels(함수 (channel_ids) { console.log(channel_ids); // ['채널_ID_1']});
다음을 사용하여 채널이 존재하는지 확인할 수 있습니다.
PushNotification.channelExists(channel_id, 함수(존재)) { console.log(존재); // 참/거짓});
다음을 통해 채널이 차단되었는지 확인할 수 있습니다.
PushNotification.channelBlocked(channel_id, 함수(차단됨)) { console.log(차단됨); // 참/거짓});
다음을 사용하여 채널을 삭제할 수 있습니다.
PushNotification.deleteChannel(channel_id);
이 작업에는 PushNotification.localNotification
의 id
매개 변수가 필요합니다. 그러면 제공된 ID가 취소 작업에 사용됩니다.
PushNotification.localNotification({...id: '123'...});PushNotification.cancelLocalNotification('123'