expo push 通知
katayama8000ドキュメント
katayama8000バックエンド
画像を見るとわかりやすい
バックエンドから、ExpoApiを叩く
おそらく、expoPushToken と data(message) を含ませる
expoPushTokenはクライアント側で登録しておくのかな？
次のドキュメントで確認
katayama8000curlでも叩ける
curl -H "Content-Type: application/json" -X POST "https://exp.host/--/api/v2/push/send" -d '{
"to": "ExponentPushToken[xxxxxxxxxxxxxxxxxxxxxx]",
"title":"hello",
"body": "world"
}'
クライアント
-
https://docs.expo.dev/push-notifications/push-notifications-setup/#add-a-minimal-working-example
上記のソースコードがわかりやすい
ライブラリはいくつか入れる必要がある
下はexpoPushTokenを登録する
async function registerForPushNotificationsAsync() {
let token;
if (Platform.OS === 'android') {
Notifications.setNotificationChannelAsync('default', {
name: 'default',
importance: Notifications.AndroidImportance.MAX,
vibrationPattern: [0, 250, 250, 250],
lightColor: '#FF231F7C',
});
}
if (Device.isDevice) {
const { status: existingStatus } = await Notifications.getPermissionsAsync();
let finalStatus = existingStatus;
if (existingStatus !== 'granted') {
const { status } = await Notifications.requestPermissionsAsync();
finalStatus = status;
}
if (finalStatus !== 'granted') {
alert('Failed to get push token for push notification!');
return;
}
token = await Notifications.getExpoPushTokenAsync({
projectId: Constants.expoConfig.extra.eas.projectId,
});
console.log(token);
} else {
alert('Must use physical device for Push Notifications');
}
return token.data;
}
Configure projectId
Using the previous example, when you are registering for push notifications, you need to use projectId. This property is used to attribute Expo push token to the specific project. For projects using EAS, the projectId property represents the Universally Unique Identifier (UUID) of that project.
和訳
前の例を使用する際に、プッシュ通知に登録する際には、projectId を使用する必要があります。このプロパティは、Expoプッシュトークンを特定のプロジェクトに関連付けるために使用されます。EASを使用するプロジェクトの場合、projectId プロパティはそのプロジェクトの一意な識別子（UUID）を表します。
katayama8000上記は送信部分
ここはバックエンドで処理しても良いかもしれない
例なので、クライアントから、自分に向かって送信している
async function sendPushNotification(expoPushToken) {
const message = {
to: expoPushToken,
sound: 'default',
title: 'Original Title',
body: 'And here is the body!',
data: { someData: 'goes here' },
};
await fetch('https://exp.host/--/api/v2/push/send', {
method: 'POST',
headers: {
Accept: 'application/json',
'Accept-encoding': 'gzip, deflate',
'Content-Type': 'application/json',
},
body: JSON.stringify(message),
});
}
受け取り部分
リスナーがリッスンしてますね
push通知後の画面遷移などはここに書いたりするのかも
useEffect(() => {
registerForPushNotificationsAsync().then(token => setExpoPushToken(token));
notificationListener.current = Notifications.addNotificationReceivedListener(notification => {
setNotification(notification);
});
responseListener.current = Notifications.addNotificationResponseReceivedListener(response => {
console.log(response);
});
return () => {
Notifications.removeNotificationSubscription(notificationListener.current);
Notifications.removeNotificationSubscription(responseListener.current);
};
}, []);
Configure projectId
Using the previous example, when you are registering for push notifications, you need to use projectId. This property is used to attribute Expo push token to the specific project. For projects using EAS, the projectId property represents the Universally Unique Identifier (UUID) of that project.
和訳
前の例を使用する際に、プッシュ通知に登録する際には、projectId を使用する必要があります。このプロパティは、Expoプッシュトークンを特定のプロジェクトに関連付けるために使用されます。EASを使用するプロジェクトの場合、projectId プロパティはそのプロジェクトの一意な識別子（UUID）を表します。