react native push notification
8.1.1
Reagieren Sie auf native lokale und Remote-Benachrichtigungen für iOS und Android
Dieses Repository wird nicht aktiv gepflegt. Der Hauptgrund ist die Zeit. Der zweite Grund ist wahrscheinlich die Komplexität der Benachrichtigungen sowohl auf iOS als auch auf Android. Da dieses Projekt wahrscheinlich eine umfangreiche Umgestaltung erfordert, um ein Problem zu beheben oder neue Funktionen zu implementieren. Ich denke, Sie sollten wahrscheinlich diese Alternativen in Betracht ziehen: Notifee kostenlos seit September oder React-Native-Notifications.
Wenn Sie daran interessiert sind, Betreuer dieses Projekts zu werden, können Sie uns gerne bei Fragen fragen.
Informieren Sie sich im CHANGELOG über Änderungen und Migration:
Änderungsprotokoll
Betreuer sind herzlich willkommen! Kontaktieren Sie mich gerne
Changelog ist ab Version 3.1.3 hier verfügbar: Changelog
npm install --save react-native-push-notification
yarn add react-native-push-notification
HINWEIS: Wenn Sie iOS als Ziel haben, müssen Sie auch die Installationsanweisungen für PushNotificationIOS befolgen, da dieses Paket davon abhängt.
HINWEIS: Für Android müssen Sie AndroidManifest.xml weiterhin manuell aktualisieren (wie unten), um geplante Benachrichtigungen verwenden zu können.
Haben Sie ein Problem? Lesen Sie die Anleitung zur Fehlerbehebung, bevor Sie ein Problem ansprechen.
Bitte lesen Sie...
Die Komponente verwendet PushNotificationIOS für den iOS-Teil. Sie sollten deren Installationsanweisungen befolgen.
HINWEIS: firebase-messaging vor Version 15 erfordert die gleiche Versionsnummer, um zur Build- und Laufzeit korrekt zu funktionieren. So verwenden Sie eine bestimmte Version:
In Ihrem android/build.gradle
ext {
googlePlayServicesVersion = "<Ihre Play-Services-Version>" // Standard: "+"firebaseMessagingVersion = "<Ihre Firebase-Version>" // Standard: "21.1.0"// Andere EinstellungencompileSdkVersion = <Ihre Kompilierungs-SDK-Version> // Standard: 23buildToolsVersion = "<Ihre Build-Tools-Version>" // Standard: "23.0.1"targetSdkVersion = <Ihre Ziel-SDK-Version> // Standard: 23supportLibVersion = "<Ihre Support-Lib-Version>" // Standard: 23.1.1}HINWEIS: localNotification() funktioniert ohne Änderungen im Anwendungsteil, während localNotificationSchedule() nur mit diesen Änderungen funktioniert:
In Ihrer android/app/src/main/AndroidManifest.xml
.....
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
<application ....><!-- Ändern Sie den Wert auf „true“, um das Popup im Vordergrund beim Empfang von Remote-Benachrichtigungen zu aktivieren (um Duplikate beim Anzeigen lokaler Benachrichtigungen zu verhindern, setzen Sie dies auf „false“) –><meta-data android: name="com.dieam.reactnativepushnotification.notification_foreground"android:value="false"/><!-- Ändern Sie den Ressourcennamen in die Akzentfarbe Ihrer App – oder in eine andere gewünschte Farbe --><meta-data android:name="com.dieam.reactnativepushnotification.notification_color"android:resource="@color/white"/> <!-- oder @android:color/{name}, um eine Standardfarbe zu verwenden --><receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationActions" />
<receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
<receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
<Absichtsfilter>
<action android:name="android.intent.action.BOOT_COMPLETED" />
<action android:name="android.intent.action.QUICKBOOT_POWERON" />
<action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
</intent-filter>
</receiver>
<serviceandroid:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"android:exported="false" >
<Absichtsfilter>
<action android:name="com.google.firebase.MESSAGING_EVENT" />
</intent-filter>
</service>
..... Wenn keine integrierte Android-Farbe ( @android:color/{name} ) für das meta-data notification_color verwendet wird. In android/app/src/main/res/values/colors.xml (Erstellen Sie die Datei, falls sie nicht vorhanden ist).
<Ressourcen>
<color name="white">#FFF</color>
</Ressourcen> Wenn Ihre App über ein @Override für onNewIntent in MainActivity.java verfügt, stellen Sie sicher, dass die Funktion einen Superaufruf für onNewIntent enthält (wenn Ihre MainActivity.java kein @Override für onNewIntent hat, überspringen Sie dies):
@Overridepublic void onNewIntent(Intent intent) {
...super.onNewIntent(intent);
...
}Stellen Sie sicher, dass Sie das Setup-Firebase korrekt installiert haben.
In android/build.gradle
Buildscript {...
Abhängigkeiten {...
classpath('com.google.gms:google-services:4.3.3')...
}
} In android/app/build.gradle
Abhängigkeiten { ...
Implementierung „com.google.firebase:firebase-analytics:17.3.0“
...
}
Plugin anwenden: 'com.google.gms.google-services' Fügen Sie dann Ihre google-services.json in android/app/ .
Hinweis: Firebase/Versionshinweise
Die Firebase-Android-Bibliothek
firebase-corewird nicht mehr benötigt. Dieses SDK enthielt das Firebase SDK für Google Analytics.Um nun Analytics oder ein anderes Firebase-Produkt zu verwenden, das die Verwendung von Analytics empfiehlt (siehe Tabelle unten), müssen Sie die Analytics-Abhängigkeit explizit hinzufügen:
com.google.firebase:firebase-analytics:17.3.0.
In android/settings.gradle
...
include ':react-native-push-notification'project(':react-native-push-notification').projectDir = file('../node_modules/react-native-push-notification/android') In Ihrem android/app/build.gradle
Abhängigkeiten {...
Implementierungsprojekt(':react-native-push-notification')...
} Registrieren Sie das Modul manuell in MainApplication.java (wenn Sie react-native link nicht verwendet haben):
import com.dieam.reactnativepushnotification.ReactNativePushNotificationPackage; // <--- Paket importierenpublic class MainApplication erweitert Anwendung implementiert 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() // <---- Add the Package );
}
};
....
} VERWENDEN SIE .configure() NICHT INNERHALB EINER KOMPONENTE, AUCH NICHT IN EINER App
Wenn Sie dies tun, werden die Benachrichtigungshandler nicht ausgelöst, da sie nicht geladen sind. Verwenden Sie stattdessen
.configure()in der ersten Datei der App, normalerweiseindex.js.
import PushNotificationIOS from „@react-native-community/push-notification-ios“;import PushNotification from „react-native-push-notification“;// Muss sich außerhalb eines Komponentenlebenszyklus befinden (z. B. „componentDidMount“).PushNotification. konfigurieren({
// (optional) Wird aufgerufen, wenn Token generiert wird (iOS und Android)
onRegister: Funktion (Token) {console.log("TOKEN:", token);
},
// (erforderlich) Wird aufgerufen, wenn eine Remote-Benachrichtigung empfangen oder geöffnet wird oder eine lokale Benachrichtigung geöffnet wird
onNotification: Funktion (Benachrichtigung) {console.log("NOTIFICATION:", notification);// Benachrichtigung verarbeiten// (erforderlich) Wird aufgerufen, wenn eine Remote-Benachrichtigung empfangen oder geöffnet wird oder eine lokale Benachrichtigung geöffnet wirdnotification.finish(PushNotificationIOS.FetchResult. NoData);
},
// (optional) Wird aufgerufen, wenn die registrierte Aktion gedrückt wird und invokeApp „false“ ist, wenn „true“ ist, wird onNotification aufgerufen (Android)
onAction: Funktion (Benachrichtigung) {console.log("ACTION:", notification.action);console.log("NOTIFICATION:", notification);// Verarbeiten Sie die Aktion
},
// (optional) Wird aufgerufen, wenn der Benutzer sich nicht für Remote-Benachrichtigungen registrieren kann. Tritt normalerweise auf, wenn APNS Probleme hat oder das Gerät ein Simulator ist. (iOS)
onRegistrationError: function(err) {console.error(err.message, err);
},
// NUR IOS (optional): Standard: alle – Berechtigungen zur Registrierung.
Berechtigungen: {alert: true,badge: true,sound: true,
},
// Sollte die erste Benachrichtigung automatisch angezeigt werden?
// Standard: true
popInitialNotification: true,
/** * (optional) Standard: true * – Wird angegeben, ob Berechtigungen (ios) und Token (android und ios) angefordert werden oder nicht, * – wenn nicht, müssen Sie PushNotificationsHandler.requestPermissions() später aufrufen * – wenn nicht Verwenden Sie die Remote-Benachrichtigung oder haben Sie Firebase nicht installiert, verwenden Sie Folgendes: * requestPermissions: Platform.OS === 'ios' */
requestPermissions: true,}); Der Beispielordner enthält eine Beispiel-App, um die Verwendung dieses Pakets zu demonstrieren. Die Benachrichtigungsverarbeitung erfolgt in NotifService.js .
Bitte testen Sie Ihre PRs mit dieser Beispiel-App, bevor Sie sie einreichen. Es wird helfen, dieses Repo zu pflegen.
Wenn eine Benachrichtigung geöffnet oder empfangen wird, wird der Rückruf onNotification aufgerufen und ein Objekt mit den Benachrichtigungsdaten übergeben.
Beispiel für ein Benachrichtigungsobjekt:
{foreground: false, // BOOLEAN: Wenn die Benachrichtigung im Vordergrund empfangen wurde oder notuserInteraction: false, // BOOLEAN: Wenn die Benachrichtigung vom Benutzer aus dem Benachrichtigungsbereich geöffnet wurde oder notmessage: 'My Notification Message', // STRING: Die Benachrichtigungsnachrichtendaten: {}, // OBJEKT: Die Push-Daten oder die definierte Benutzerinfo in lokalen Benachrichtigungen}PushNotification.localNotification(Details: Objekt)
BEISPIEL:
PushNotification.localNotification({
/* Nur Android-Eigenschaften */
ChannelId: „your-channel-id“, // (erforderlich) ChannelId, wenn der Kanal nicht existiert, wird keine Benachrichtigung ausgelöst.
ticker: „Mein Benachrichtigungsticker“, // (optional)
showWhen: true, // (optional) Standard: true
autoCancel: true, // (optional) Standard: true
largeIcon: „ic_launcher“, // (optional) Standard: „ic_launcher“. Verwenden Sie „“, wenn das Symbol nicht groß ist.
largeIconUrl: „https://www.example.tld/picture.jpg“, // (optional) Standard: undefiniert
smallIcon: „ic_notification“, // (optional) Standard: „ic_notification“ mit Fallback für „ic_launcher“. Verwenden Sie „“ für das standardmäßige kleine Symbol.
bigText: „Mein großer Text, der angezeigt wird, wenn die Benachrichtigung erweitert wird. Das Styling kann mithilfe von HTML-Tags erfolgen (Einzelheiten finden Sie in der Android-Dokumentation)“, // (optional) Standard: „message“ prop
subText: „Dies ist ein subText“, // (optional) Standard: keiner
bigPictureUrl: „https://www.example.tld/picture.jpg“, // (optional) Standard: undefiniert
bigLargeIcon: „ic_launcher“, // (optional) Standard: undefiniert
bigLargeIconUrl: „https://www.example.tld/bigicon.jpg“, // (optional) Standard: undefiniert
Farbe: „rot“, // (optional) Standard: Systemstandard
vibrate: true, // (optional) Standard: true
vibration: 300, // Vibrationslänge in Millisekunden, ignoriert, wenn vibrate=false, Standard: 1000
tag: „some_tag“, // (optional) Tag zur Nachricht hinzufügen
group: „group“, // (optional) Gruppe zur Nachricht hinzufügen
groupSummary: false, // (optional) Diese Benachrichtigung als Gruppenzusammenfassung für eine Gruppe von Benachrichtigungen festlegen, Standard: false
fortlaufend: false, // (optional) legt fest, ob es sich um eine „laufende“ Benachrichtigung handelt
Priorität: „hoch“, // (optional) Benachrichtigungspriorität festlegen, Standard: hoch
Sichtbarkeit: „private“, // (optional) Benachrichtigungssichtbarkeit festlegen, Standard: privat
ignoreInForeground: false, // (optional) Wenn true, ist die Benachrichtigung nicht sichtbar, wenn sich die App im Vordergrund befindet (nützlich für die Parität mit der Darstellung von iOS-Benachrichtigungen). sollte in Kombination mit der Einstellung „com.dieam.reactnativepushnotification.notification_foreground“ verwendet werden
shortcutId: „shortcut-id“, // (optional) Wenn diese Benachrichtigung ein Duplikat einer Launcher-Verknüpfung ist, wird die ID der Verknüpfung festgelegt, falls der Launcher die Verknüpfung ausblenden möchte, standardmäßig undefiniert
onlyAlertOnce: false, // (optional) Warnung wird nur einmal mit Ton und Benachrichtigung geöffnet, Standard: false
when: null, // (optional) Fügen Sie einen Zeitstempel (Unix-Zeitstempelwert in Millisekunden) hinzu, der sich auf die Benachrichtigung bezieht (normalerweise die Zeit, zu der das Ereignis aufgetreten ist). Für Apps, die auf Build.VERSION_CODES.N und höher abzielen, wird diese Zeit standardmäßig nicht mehr angezeigt und muss mit „showWhen“ aktiviert werden, Standard: null.
usedChronometer: false, // (optional) Zeigt das „Wann“-Feld als Stoppuhr an. Anstatt „wann“ als Zeitstempel darzustellen, zeigt die Benachrichtigung eine automatisch aktualisierte Anzeige der Minuten und Sekunden seit wann. Nützlich, wenn eine verstrichene Zeit angezeigt wird (z. B. ein laufender Telefonanruf), Standardwert: false.
timeoutAfter: null, // (optional) Gibt eine Dauer in Millisekunden an, nach der diese Benachrichtigung abgebrochen werden soll, sofern sie nicht bereits abgebrochen wurde, Standard: null
messageId: „google:message_id“, // (optional) wurde als „message_id“ zu Intent-Extras hinzugefügt, damit beim Öffnen der Push-Benachrichtigung vom @react-native-firebase/messaging-Modul gespeicherte Daten gefunden werden können.
Aktionen: ["Ja", "Nein"], // (nur Android) Weitere Informationen finden Sie im Dokument zu Benachrichtigungsaktionen
invokeApp: true, // (optional) Dies ermöglicht Klickaktionen, um die Anwendung wieder in den Vordergrund zu bringen oder im Hintergrund zu bleiben, Standard: true
/* Nur iOS-Eigenschaften */
Kategorie: "", // (optional) Standard: leere Zeichenfolge
subtitle: „My Notification Subtitle“, // (optional) kleinerer Titel unter dem Benachrichtigungstitel
/* iOS- und Android-Eigenschaften */
id: 0, // (optional) Gültige, eindeutige 32-Bit-Ganzzahl, angegeben als Zeichenfolge. Standard: Automatisch generierte eindeutige ID
title: „Mein Benachrichtigungstitel“, // (optional)
message: „Meine Benachrichtigungsnachricht“, // (erforderlich)
Bild: „https://www.example.tld/picture.jpg“, // (optional) Zeigt ein Bild mit der Benachrichtigung an, Alias von „bigPictureUrl“ für Android. Standard: undefiniert
userInfo: {}, // (optional) Standard: {} (die Verwendung von null löst einen JSON-Wert „<null>“-Fehler aus)
playSound: false, // (optional) Standard: true
soundName: „default“, // (optional) Sound, der abgespielt wird, wenn die Benachrichtigung angezeigt wird. Der Wert „default“ spielt den Standardton ab. Es kann auf einen benutzerdefinierten Sound wie „android.resource://com.xyz/raw/my_sound“ eingestellt werden. Es sucht nach der Audiodatei „my_sound“ im Verzeichnis „res/raw“ und spielt sie ab. Standard: 'default' (Standardton wird abgespielt)
Zahl: 10, // (optional) Gültige 32-Bit-Ganzzahl als Zeichenfolge angegeben. Standard: keine (Kann nicht Null sein)
repeatType: „day“, // (optional) Wiederholungsintervall. Weitere Informationen finden Sie im Abschnitt „Wiederholte Benachrichtigungen“.});PushNotification.localNotificationSchedule(Details: Objekt)
BEISPIEL:
PushNotification.localNotificationSchedule({
//... Sie können alle Optionen von localNotifications verwenden
message: „Meine Benachrichtigungsnachricht“, // (erforderlich)
date: new Date(Date.now() + 60 * 1000), // in 60 Sekunden
AllowWhileIdle: false, // (optional) Benachrichtigung so einstellen, dass sie beim Einschlafen funktioniert, Standard: false
/* Nur Android-Eigenschaften */
RepeatTime: 1, // (optional) Inkrement des konfigurierten RepeatType. Weitere Informationen finden Sie im Abschnitt „Wiederholte Benachrichtigungen“.});PushNotification.popInitialNotification(Rückruf)
BEISPIEL:
PushNotification.popInitialNotification((notification) => {
console.log('Initial Notification', notification);}); Fügen Sie in Android Ihre benutzerdefinierte Sounddatei zu [project_root]/android/app/src/main/res/raw hinzu
Fügen Sie in iOS Ihre benutzerdefinierte Sounddatei zu den Resources in xCode hinzu.
Geben Sie im JSON-Ordner der Standortbenachrichtigung den vollständigen Dateinamen an:
soundName: 'my_sound.mp3'
Um Kanäle zu verwenden, erstellen Sie diese beim Start und übergeben Sie die passende channelId an PushNotification.localNotification oder PushNotification.localNotificationSchedule .
import PushNotification, {Importance} from 'react-native-push-notification';... PushNotification.createChannel({channelId: "channel-id", // (erforderlich)channelName: "Mein Kanal", // (erforderlich) channelDescription: „Ein Kanal zum Kategorisieren Ihrer Benachrichtigungen“, // (optional) Standard: undefiniert. playSound: false, // (optional) Standard: true soundName: „default“, // (optional) Siehe Parameter „soundName“ der Funktion „localNotification“: Importance.HIGH, // (optional) Standard: Importance.HIGH Int-Wert der Android-Benachrichtigungsbedeutung: true, // (optional) Standard: true Muster, wenn wahr.},(created) => console.log(`createChannel returns '${created}'`) // (optional) Callback gibt zurück, ob der Kanal erstellt wurde, false bedeutet, dass er bereits existierte.
);HINWEIS: Ohne Kanal funktionieren Benachrichtigungen nicht
In den Benachrichtigungsoptionen müssen Sie eine Kanal-ID mit channelId: "your-channel-id" angeben. Wenn der Kanal nicht existiert, wird die Benachrichtigung möglicherweise nicht ausgelöst. Sobald der Kanal erstellt wurde, kann er nicht mehr aktualisiert werden. Stellen Sie sicher, dass Ihre channelId anders ist, wenn Sie diese Optionen ändern. Wenn Sie einen Kanal auf andere Weise erstellt haben, werden die Optionen des Kanals angewendet.
Wenn Sie einen anderen Standardkanal für die Remote-Benachrichtigung verwenden möchten, lesen Sie die Dokumentation von Firebase:
Richten Sie eine Firebase Cloud Messaging-Client-App auf Android ein
<meta-data android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="@string/default_notification_channel_id" />
Für lokale Benachrichtigungen steht die gleiche Option zur Verfügung:
Sie können Folgendes verwenden:
<meta-data android:name="com.dieam.reactnativepushnotification.default_notification_channel_id" android:value="@string/default_notification_channel_id" />
Falls nicht definiert, Fallback auf den im AndroidManifest definierten Firebase-Wert:
<meta-data android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="..." />
Wenn nicht definiert, wird auf die Standard-Firebase-Kanal-ID fcm_fallback_notification_channel zurückgegriffen
Sie können verfügbare Kanäle auflisten mit:
PushNotification.getChannels(function (channel_ids) {
console.log(channel_ids); // ['channel_id_1']});Sie können überprüfen, ob ein Kanal vorhanden ist mit:
PushNotification.channelExists(channel_id, function (exists) {
console.log(existiert); // wahr/falsch});Sie können überprüfen, ob ein Kanal blockiert ist:
PushNotification.channelBlocked(channel_id, function (blocked) {
console.log(blockiert); // wahr/falsch});Sie können einen Kanal löschen mit:
PushNotification.deleteChannel(channel_id);
Für diesen Vorgang ist der id Parameter für PushNotification.localNotification erforderlich. Die angegebene ID wird dann für den Abbruchvorgang verwendet.
PushNotification.localNotification({...id: '123'...});PushNotification.cancelLocalNotification('123' 
