プッシュ通知 (Expo)¶
FCMの設定 (Android)¶
FCMの設定 (Android) を参考に、Firebaseプロジェクトの設定を行ってください。
APNs証明書の設定 (iOS)¶
APNs証明書の設定 (iOS) を参考に、APNs証明書をRepro管理画面に登録してください。
React Native Firebase をインストールする (Android)¶
Repro ではプッシュ通知を受信する際、Android 環境では Firebase Cloud Messaging を利用しています。 この利用のため、React Native Firebase を導入してください。
npm install @react-native-firebase/app
npm install @react-native-firebase/messaging
導入方法の詳細は以下を参考にしてください。
React Native Firebase の設定 (iOSプロジェクトを含む場合)¶
Android および iOS のプロジェクトを同時に開発している場合のみ、以下の設定を行ってください。
expo-build-properties をインストールしてください。
npx expo install expo-build-properties
また、 app.json 内に以下の項目を追加してください。
{
"expo": {
"plugins": [
[
"expo-build-properties",
{
"ios": {
"useFrameworks": "static"
}
}
],
]
}
}
チャネルの設定を追加する (Android)¶
app.json ファイルを編集する を参考に、app.json ファイルにプッシュ通知のチャネルの設定を追加してください。
また必要に応じてその他の項目も設定してください。
google-services.json ファイルを配置する (Android)¶
FCMの設定 (Android) を参考に、Firebase Console から google-services.json ファイルをダウンロードしてください。
次に、ダウンロードした google-services.json ファイルをプロジェクトの assets ディレクトリにコピーしてください。
その後、プロジェクト内 app.json の expo.android に "googleServicesFile": "./assets/google-services.json" を追記してください。
{
"expo": {
"android": {
"googleServicesFile": "./assets/google-services.json"
}
}
}
Expo Notifications をインストールする (iOS/Android)¶
プロジェクトに対し、以下の通り Expo Notifications をインストールしてください。
npx expo install expo-notifications
Entitlementsの設定を行う (iOS)¶
プロジェクト内 app.json の expo.ios に "entitlements": "aps-environment" を追記してください。
aps-environment の値は環境によって適宜変更してください。
{
"expo": {
"ios": {
"entitlements": {
"aps-environment": "development"
}
}
}
}
プッシュトークンをReproに送信する処理を実装する (iOS/Android)¶
プッシュ通知の宛先を指定するためにプッシュトークンをReproに送信します。
デバイストークンを取得する処理を追加し、 Repro.setPushToken を利用し値をセットしてください。
import { useEffect } from 'react';
import * as Notifications from 'expo-notifications';
import Repro from 'react-native-repro';
...
useEffect(() => {
Notifications.getDevicePushTokenAsync().then(token => {
Repro.setPushToken(token.data);
})
.catch((e) => {
...
});
...
});