react native push notification
8.1.1
iOS および Android 向けの React Native ローカルおよびリモート通知
このリポジトリは積極的に保守されていません。主な理由は時間です。 2 つ目は、おそらく iOS と Android の両方での通知の複雑さです。このプロジェクトはおそらく、問題を修正したり、新機能を実装したりするために大規模なリファクタリングが必要になるためです。おそらく次の代替案を検討する必要があると思います。9 月から無料になった Notifee か、react-native-notifications です。
このプロジェクトのメンテナーになることに興味がある場合は、気軽に問題で質問してください。
CHANGELOG で変更と移行を確認してください。
変更履歴
メンテナーの方も大歓迎です！お気軽にお問い合わせください
変更ログは、バージョン 3.1.3 からここで入手できます: 変更ログ
npm install --save react-native-push-notification
yarn add react-native-push-notification
注: iOS をターゲットとする場合、このパッケージは PushNotificationIOS に依存しているため、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 = "<サポート ライブラリのバージョン>" // デフォルト: 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} --><受信機 android: name="com.dieam.reactnativepushnotification.modules.RNPushNotificationActions" />
<受信者 android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
<受信者 android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
<インテントフィルター>
<action android:name="android.intent.action.BOOT_COMPLETED" />
<アクション android:name="android.intent.action.QUICKBOOT_POWERON" />
<action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
</インテントフィルター>
</受信者>
<serviceandroid:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"android:exported="false" >
<インテントフィルター>
<アクション android:name="com.google.firebase.MESSAGING_EVENT" />
</インテントフィルター>
</サービス>
…… notification_color meta-data項目に組み込みの Android カラー ( @android:color/{name} ) を使用しない場合。 android/app/src/main/res/values/colors.xml内 (ファイルが存在しない場合は作成します)。
<リソース>
<color name="white">#FFF</color>
</リソース>アプリにMainActivity.javaの onNewIntent に対する @Override がある場合、その関数に onNewIntent に対するスーパー呼び出しが含まれていることを確認してください ( MainActivity.javaに onNewIntent に対する @Override がない場合は、これをスキップしてください)。
@Overridepublic void onNewIntent(Intent インテント) {
...super.onNewIntent(意図);
...
}セットアップ Firebase が正しくインストールされていることを確認してください。
android/build.gradle内
ビルドスクリプト {...
依存関係 {...
classpath('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使用しなかった場合):
com.dieam.reactnativepushnotification.ReactNativePushNotificationPackage をインポートします。 // <--- Import Packagepublic class MainApplication extends Applicationimplements 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()を使用します。
import PushNotificationIOS from "@react-native-community/push-notification-ios";import PushNotification from "react-native-push-notification";// コンポーネント LifeCycle (`componentDidMount` など) の外部にある必要があります。PushNotification。構成({
// (オプション) トークンの生成時に呼び出されます (iOS および Android)
onRegister: function (トークン) {console.log("TOKEN:", トークン);
}、
// (必須) リモートが受信または開かれたとき、またはローカル通知が開かれたときに呼び出されます
onNotification: function (notification) {console.log("NOTIFICATION:", 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: function(err) {console.error(err.message, err);
}、
// IOS のみ (オプション): デフォルト: すべて - 登録する権限。
権限: {アラート: true、バッジ: true、サウンド: true、
}、
// 最初の通知を自動的にポップするかどうか
// デフォルト: true
PopInitialNotification: true、
/** * (オプション) デフォルト: true * - 権限 (ios) とトークン (android および ios) が要求されるかどうかを指定します。 * - 要求されない場合は、後で PushNotificationsHandler.requestPermissions() を呼び出す必要があります * - 要求されない場合リモート通知を使用する場合、または Firebase がインストールされていない場合は、これを使用します: * requestPermissions: Platform.OS === 'ios' */
requestPermissions: true,});Example フォルダーには、このパッケージの使用方法を示すサンプル アプリが含まれています。通知処理はNotifService.jsで行われます。
PR を送信する前に、このサンプル アプリを使用して PR をテストしてください。このリポジトリを維持するのに役立ちます。
通知が開かれるか受信されると、コールバックonNotificationが呼び出され、通知データを含むオブジェクトが渡されます。
通知オブジェクトの例:
{foreground: false, // BOOLEAN: 通知がフォアグラウンドで受信された場合、または notuserInteraction: false, // BOOLEAN: 通知がユーザーによって通知領域から開かれた場合、または notmessage: 'My Notice Message', // STRING:通知メッセージデータ: {}, // オブジェクト: ローカル通知のプッシュ データまたは定義された userInfo}PushNotification.localNotification(詳細: オブジェクト)
例：
PushNotification.localNotification({
/* Android のみのプロパティ */
channelId: "your-channel-id", // (必須) channelId、チャネルが存在しない場合、通知はトリガーされません。
ティッカー: "私の通知ティッカー", // (オプション)
showWhen: true, // (オプション) デフォルト: true
autoCancel: true、// (オプション) デフォルト: true
largeIcon: "ic_launcher", // (オプション) デフォルト: "ic_launcher"。大きなアイコンがない場合は「」を使用します。
largeIconUrl: "https://www.example.tld/picture.jpg", // (オプション) デフォルト: 未定義
smallIcon: "ic_notification", // (オプション) デフォルト: "ic_notification"、"ic_launcher" のフォールバック。デフォルトの小さいアイコンには「」を使用します。
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
vibrate: 300, // 振動の長さ (ミリ秒)、vibrate=false の場合は無視されます、デフォルト: 1000
tag: "some_tag", // (オプション) メッセージにタグを追加します
group: "group", // (オプション) グループをメッセージに追加します
groupsummary: false, // (オプション) この通知を通知グループのグループ概要に設定します、デフォルト: false
進行中: false, // (オプション) これが「進行中の」通知かどうかを設定します
priority: "high", // (オプション) 通知の優先順位を設定します、デフォルト: 高
Visibility: "private", // (オプション) 通知の可視性を設定します、デフォルト: private
ignoreInForeground: false, // (オプション) true の場合、アプリがフォアグラウンドにあるときに通知は表示されません (iOS 通知の表示方法と同等の場合に役立ちます)。 `com.dieam.reactnativepushnotification.notification_foreground`設定と組み合わせて使用する必要があります
shortcutId: "shortcut-id", // (オプション) この通知がランチャーのショートカットと重複する場合、ランチャーがショートカットを非表示にしたい場合に備えて、ショートカットの ID を設定します。デフォルトは未定義です
OnlyAlertOnce: false、// (オプション) アラートは音とともに 1 回だけ開き、通知します、デフォルト: false
when: null, // (オプション) 通知 (通常はイベントが発生した時刻) に関連するタイムスタンプ (ミリ秒単位の Unix タイムスタンプ値) を追加します。 Build.VERSION_CODES.N 以降をターゲットとするアプリの場合、この時間はデフォルトでは表示されなくなり、`showWhen` (デフォルト: null) を使用してオプトインする必要があります。
usesChronometer: false, // (オプション) `when` フィールドをストップウォッチとして表示します。通知には、「いつ」をタイムスタンプとして表示する代わりに、いつからの分と秒が自動的に更新されて表示されます。経過時間を表示する場合 (通話中の場合など) に役立ちます。デフォルト: false。
timeoutAfter: null, // (オプション) この通知がキャンセルされるまでの期間をミリ秒単位で指定します (まだキャンセルされていない場合、デフォルト: null)
messageId: "google:message_id", // (オプション) `message_id` としてインテント エクストラに追加されるため、プッシュ通知を開いたときに @react-native-firebase/messaging モジュールに保存されているデータを見つけることができます。
アクション: ["はい", "いいえ"], // (Android のみ) 詳細については、通知アクションのドキュメントを参照してください。
invokeApp: true, // (オプション) これにより、アクションをクリックしてアプリケーションをフォアグラウンドに戻すか、バックグラウンドに留まることが可能になります。デフォルト: true
/* iOS のみのプロパティ */
カテゴリ: "", // (オプション) デフォルト: 空の文字列
subtitle: "My Notice Subtitle", // (オプション) 通知タイトルの下にある小さなタイトル
/* iOS および Android のプロパティ */
id: 0, // (オプション) 有効な一意の 32 ビット整数を文字列として指定します。デフォルト: 自動生成された一意の ID
title: "私の通知のタイトル", // (オプション)
message: "私の通知メッセージ", // (必須)
pic: "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」オーディオファイルを探して再生します。デフォルト: 'デフォルト' (デフォルトのサウンドが再生されます)
number: 10, // (オプション) 有効な 32 ビット整数を文字列として指定します。デフォルト: なし (ゼロにすることはできません)
repeatType: "day", // (オプション) 繰り返し間隔。詳細については、「繰り返しの通知」セクションを確認してください。});PushNotification.localNotificationSchedule(詳細: オブジェクト)
例：
PushNotification.localNotificationSchedule({
//... localNotifications のすべてのオプションを使用できます
message: "私の通知メッセージ", // (必須)
date: new Date(Date.now() + 60 * 1000), // 60 秒後
allowwhileIdle: false, // (オプション) 居眠り中に通知が動作するように設定します、デフォルト: false
/* Android のみのプロパティ */
repeatTime: 1, // (オプション) 設定されたrepeatTypeの増分。詳細については、「繰り返しの通知」セクションを確認してください。});PushNotification.popInitialNotification(コールバック)
例：
PushNotification.popInitialNotification((通知) => {
console.log('初期通知', notification);});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: "通知を分類するチャネル", // (オプション) デフォルト: unknown. playSound: false, // (オプション) デフォルト: true soundName: "default", // (オプション) `localNotification` 関数の `soundName` パラメーターを参照してください。 important: Importance.HIGH, // (オプション) デフォルト: Android 通知の重要度の Int 値 vibrate: true, // (オプション) デフォルト: true。true の場合、デフォルトの振動パターンを作成します。},(created) => console.log(`createChannel returns '${created}'`) // (オプション) コールバックはチャネルが作成されたかどうかを返します。 false はチャネルがすでに存在していたことを意味します。
);注: チャンネルがないと通知は機能しません
通知オプションでは、 channelId: "your-channel-id"でチャネル ID を指定する必要があります。チャネルが存在しない場合、通知はトリガーされない可能性があります。チャネルが作成されると、チャネルを更新することはできません。これらのオプションを変更する場合は、 channelIdが異なることを確認してください。別の方法でチャンネルを作成した場合は、そのチャンネルのオプションが適用されます。
リモート通知に別のデフォルト チャネルを使用する場合は、Firebase のドキュメントを参照してください。
Android で Firebase Cloud Messaging クライアント アプリをセットアップする
<メタデータ android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="@string/default_notification_channel_id" />
ローカル通知の場合も、同じ種類のオプションが利用可能です。
使用できます:
<メタデータ android:name="com.dieam.reactnativepushnotification.default_notification_channel_id" android:value="@string/default_notification_channel_id" />
定義されていない場合は、 AndroidManifestで定義されている Firebase 値にフォールバックします。
<メタデータ android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="..." />
定義されていない場合は、デフォルトの Firebase チャネル ID fcm_fallback_notification_channelにフォールバックします。
次のコマンドを使用して、利用可能なチャンネルをリストできます。
PushNotification.getChannels(function (channel_ids) {
console.log(チャンネルID); // ['channel_id_1']});チャネルが存在するかどうかは、次のコマンドで確認できます。
PushNotification.channelExists(channel_id, function (exists) {
console.log(存在します); // true/false});チャンネルがブロックされているかどうかは、次の方法で確認できます。
PushNotification.channelBlocked(channel_id, function (ブロックされました) {
console.log(ブロックされました); // true/false});次の方法でチャンネルを削除できます。
PushNotification.deleteChannel(channel_id);
この操作には、 PushNotification.localNotificationのidパラメーターが必要です。指定された ID はキャンセル操作に使用されます。
PushNotification.localNotification({...id: '123'...});PushNotification.cancelLocalNotification('123' 
