Benachrichtigungen über die Expo Push API senden
Senden Sie eine Benachrichtigungs-Payload per POST von Ihrem Server oder einem curl-Befehl an die Expo Push API, adressieren Sie ein bestimmtes Gerät anhand seines Tokens und überprüfen Sie die Zustellung im Expo-Dashboard.
Benachrichtigungen über die Expo Push API senden ist eine kostenlose React Native Academy-Lektion auf CoddyKit. Dies ist Lektion 2 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des React Native Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der React Native Academy-Kurs umfasst insgesamt 4 Lektionen.
Der Expo Push Notification Service
Der Expo Push Notification Service (EPNS) ist ein Vermittlungsdienst zwischen Ihrem Server und den plattformspezifischen Push-Gateways (Apple APNs und Google FCM). Anstatt zwei separate Dienste zu integrieren, senden Sie eine HTTP-Anfrage an die API von Expo, die die Plattformunterschiede für Sie übernimmt.
EPNS ist für Apps mit dem verwalteten Workflow von Expo kostenlos und übernimmt die Zertifikatsverwaltung, das Token-Routing, die Bündelung und die Fehlerberichterstattung. Bei Produktiv-Apps mit hohem Volumen können Sie auf eine direkte APNs-/FCM-Integration umsteigen, für die meisten Apps ist EPNS jedoch ein hervorragender Ausgangspunkt.
Endpunkt der Expo Push API
Senden Sie eine POST-Anfrage an https://exp.host/--/api/v2/push/send mit einem JSON-Body, der eine oder mehrere Benachrichtigungsnachrichten enthält. Jede Nachricht richtet sich an einen bestimmten Expo-Push-Token und enthält den Inhalt der Benachrichtigung.
Die API akzeptiert bis zu 100 Nachrichten pro Anfrage, um eine effiziente Bündelung zu ermöglichen. Senden Sie immer von Ihrem Server aus, niemals vom Client – der Client kennt die Tokens anderer Nutzerinnen und Nutzer nicht, und das Senden vom Client legt Ihre Serverlogik offen.
// From your backend server (Node.js example):
const response = await fetch('https://exp.host/--/api/v2/push/send', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
to: 'ExponentPushToken[AbCdEfGhIjKl...]',
title: 'New message',
body: 'Alice sent you a message!',
}),
});
const result = await response.json();
console.log(result);Felder einer Benachrichtigungsnachricht
Das Objekt für eine Benachrichtigungsnachricht unterstützt mehrere Felder:
- to (erforderlich) – der Expo-Push-Token oder ein Array von Tokens
- title – der fett dargestellte Titel der Benachrichtigung
- body – der Text der Benachrichtigung
- data – ein JSON-Objekt mit benutzerdefinierten Daten, die die App beim Antippen auslesen kann
- sound –
'default', um den Geräteton abzuspielen - badge – eine Ganzzahl, die die Anzahl am iOS-App-Symbol festlegt
- channelId – die ID des Android-Benachrichtigungskanals
const message = {
to: 'ExponentPushToken[AbCdEfGhIjKl...]',
sound: 'default',
title: 'Order Shipped',
body: 'Your order #1234 is on its way!',
badge: 1,
channelId: 'orders',
data: {
type: 'order_update',
orderId: '1234',
screen: 'OrderDetail',
},
};An mehrere Geräte senden
Um dieselbe Benachrichtigung an mehrere Geräte zu senden (z. B. als Rundnachricht oder an alle Geräte einer Nutzerin bzw. eines Nutzers), übergeben Sie ein Array von Tokens im Feld to. Jeder Token erhält die Benachrichtigung.
Teilen Sie Ihre Token-Liste bei großen Zielgruppen in Pakete von jeweils 100 Tokens auf und senden Sie pro Paket eine separate API-Anfrage. Die Expo Push API begrenzt die Rate und die Paketgröße, daher ist eine Bündelung für größere Mengen erforderlich.
// Send to multiple devices:
const messages = tokens.map((token) => ({
to: token,
title: 'New feature available!',
body: 'Check out what we built for you.',
data: { screen: 'WhatsNew' },
}));
// Chunk into batches of 100:
const chunks = [];
for (let i = 0; i < messages.length; i += 100) {
chunks.push(messages.slice(i, i + 100));
}
for (const chunk of chunks) {
await fetch('https://exp.host/--/api/v2/push/send', {
method: 'POST',
body: JSON.stringify(chunk),
});
}Das Expo Server SDK verwenden
Verwenden Sie statt roher HTTP-Anfragen das offizielle npm-Paket expo-server-sdk in Ihrem Node.js-Backend. Es bietet standardmäßig Funktionen zum Aufteilen in Pakete, zur Fehlerbehandlung und zur Prüfung von Empfangsbestätigungen. Installieren Sie es mit npm install expo-server-sdk.
Die Methode sendPushNotificationsAsync des SDK übernimmt die Bündelung automatisch und gibt Ticket-Objekte zurück, mit denen Sie später die Zustellungsbelege prüfen können. Außerdem validiert sie Tokens vor dem Senden, damit keine API-Aufrufe für fehlerhafte Tokens verschwendet werden.
// Backend (Node.js):
const { Expo } = require('expo-server-sdk');
const expo = new Expo();
const messages = tokens
.filter(token => Expo.isExpoPushToken(token))
.map(token => ({
to: token,
title: 'Hello!',
body: 'This is a push notification',
data: { type: 'greeting' },
}));
const chunks = expo.chunkPushNotifications(messages);
const tickets = [];
for (const chunk of chunks) {
const ticketChunk = await expo.sendPushNotificationsAsync(chunk);
tickets.push(...ticketChunk);
}Push-Empfangsbestätigungen: Zustellung bestätigen
Beim Senden an die Expo API erhalten Sie sofort Tickets – diese bestätigen, dass die Nachricht angenommen wurde, nicht aber, dass sie zugestellt wurde. Prüfen Sie einige Minuten später die Empfangsbestätigungen, um die tatsächliche Zustellung an APNs/FCM zu überprüfen. Verwenden Sie die Ticket-IDs aus dem Sendevorgang, um Empfangsbestätigungen unter https://exp.host/--/api/v2/push/getReceipts abzurufen.
Empfangsbestätigungen mit dem Status 'error' und dem Code DeviceNotRegistered bedeuten, dass der Token nicht mehr gültig ist. Entfernen Sie ihn aus Ihrer Datenbank, damit Ihre Token-Liste aktuell bleibt und keine API-Aufrufe verschwendet werden.
// After sending, check receipts (wait ~5 minutes):
const receiptIds = tickets
.filter(t => t.status === 'ok')
.map(t => t.id);
const receiptChunks = expo.chunkPushNotificationReceiptIds(receiptIds);
for (const chunk of receiptChunks) {
const receipts = await expo.getPushNotificationReceiptsAsync(chunk);
for (const [id, receipt] of Object.entries(receipts)) {
if (receipt.status === 'error') {
if (receipt.details.error === 'DeviceNotRegistered') {
await removeTokenFromDB(id); // clean up
}
}
}
}Push-Benachrichtigungen testen
Expo stellt unter https://expo.dev/notifications ein Tool zum Testen von Push-Benachrichtigungen bereit. Geben Sie Ihren Expo-Push-Token ein und senden Sie Testbenachrichtigungen direkt über das Dashboard – dafür ist kein Servercode erforderlich. Das ist besonders hilfreich, um Darstellung und Zustellung von Benachrichtigungen auf einem echten Gerät zu testen.
Sie können Testbenachrichtigungen auch mit einem curl-Befehl vom Terminal aus senden. Das ist während der Entwicklung schneller und ermöglicht es Ihnen, beliebige Payloads und Datenobjekte zu testen, ohne zuerst Servercode schreiben zu müssen.
# Test push from terminal:
curl -H 'Content-Type: application/json' \
-X POST 'https://exp.host/--/api/v2/push/send' \
-d '{
"to": "ExponentPushToken[YOUR_TOKEN_HERE]",
"title": "Test Notification",
"body": "Hello from curl!",
"data": { "test": true }
}'
# Or use Expo dashboard:
# https://expo.dev/notificationsBenachrichtigungen in der App planen
Neben Push-Benachrichtigungen von einem Server können Sie lokale Benachrichtigungen direkt in der App planen – sie funktionieren offline und benötigen keinen Server. Verwenden Sie Notifications.scheduleNotificationAsync mit einem Trigger, der festlegt, wann die Benachrichtigung ausgelöst wird.
Häufige Triggertypen: seconds – nach einer Verzögerung auslösen; date – zu einem bestimmten Zeitpunkt auslösen; weekly – an einem bestimmten Wochentag und zu einer bestimmten Uhrzeit auslösen. Lokale Benachrichtigungen eignen sich ideal für Erinnerungen, Alarme und geplante Rückfragen.
// Schedule a local notification 10 seconds from now:
await Notifications.scheduleNotificationAsync({
content: {
title: 'Reminder',
body: 'Time to review your daily goals!',
data: { screen: 'Goals' },
},
trigger: {
seconds: 10, // fires after 10 seconds
},
});
// Schedule for a specific date:
await Notifications.scheduleNotificationAsync({
content: { title: 'Meeting in 5 minutes', body: 'Team standup' },
trigger: new Date(Date.now() + 5 * 60 * 1000),
});Priorität und Zustellung von Benachrichtigungen
Die Priorität einer Benachrichtigung beeinflusst, wie unmittelbar das Betriebssystem sie zustellt. Benachrichtigungen mit hoher Priorität schalten den Bildschirm des Geräts sofort ein (etwa für dringende Hinweise wie Nachrichten). Benachrichtigungen mit normaler Priorität werden gebündelt und zugestellt, wenn es günstig ist (etwa bei Werbeinhalten).
Legen Sie in der Expo Push API für zeitkritische Benachrichtigungen priority: 'high' fest. Gehen Sie sparsam damit um – wenn Sie zu viele Benachrichtigungen mit hoher Priorität senden, gewöhnen sich Nutzerinnen und Nutzer daran, sie zu ignorieren. Bei Missbrauch kann Apple die Priorität der Benachrichtigungen Ihrer App herabsetzen.
// High priority (message, call, alert):
{
to: token,
title: 'Incoming call',
body: 'Bob is calling you',
priority: 'high',
channelId: 'calls',
data: { screen: 'IncomingCall', callId: 'abc' },
}
// Normal priority (digest, update):
{
to: token,
title: 'Weekly summary ready',
body: 'See how you did this week!',
priority: 'normal',
channelId: 'digest',
}Tippen auf eine Benachrichtigung beim App-Start verarbeiten
Wenn eine Nutzerin oder ein Nutzer auf eine Benachrichtigung tippt und die App vollständig geschlossen ist, wird die App gestartet. Um abhängig von der Benachrichtigung zum richtigen Bildschirm zu navigieren, lesen Sie beim Start mit Notifications.getLastNotificationResponseAsync() die letzte Antwort auf eine Benachrichtigung aus.
Lesen Sie diese früh in der Startsequenz Ihrer App aus (in App.js oder Ihrem Root-Navigator) und navigieren Sie weiter, wenn die Antwort eine data.screen-Nutzlast enthält. So verbinden Sie Push-Benachrichtigungen mit einer tiefen Navigation innerhalb Ihrer App.
useEffect(() => {
Notifications.getLastNotificationResponseAsync().then((response) => {
if (response) {
const { screen, id } = response.notification.request.content.data;
if (screen && navigationRef.isReady()) {
navigationRef.navigate(screen, { id });
}
}
});
}, []);Geplante Benachrichtigungen abbrechen und verwalten
Brechen Sie eine bestimmte geplante Benachrichtigung mit Notifications.cancelScheduledNotificationAsync(identifier) ab. Dabei ist identifier die Zeichenfolge, die von scheduleNotificationAsync zurückgegeben wird. Mit Notifications.cancelAllScheduledNotificationsAsync() brechen Sie alle geplanten Benachrichtigungen ab.
Speichern Sie Benachrichtigungs-IDs in AsyncStorage, wenn Sie sie nach einem Neustart der App abbrechen müssen – beispielsweise, wenn Sie eine Erinnerung abbrechen, sobald die Nutzerin bzw. der Nutzer eine Aufgabe als erledigt markiert.
// Schedule and save identifier:
const id = await Notifications.scheduleNotificationAsync({
content: { title: 'Take your medicine' },
trigger: { hour: 9, minute: 0, repeats: true },
});
await AsyncStorage.setItem('medicineReminderNotifId', id);
// Later, cancel it:
const notifId = await AsyncStorage.getItem('medicineReminderNotifId');
if (notifId) {
await Notifications.cancelScheduledNotificationAsync(notifId);
await AsyncStorage.removeItem('medicineReminderNotifId');
}Kurzer Wissenstest
Testen Sie Ihr Verständnis der Konzepte zur mobilen Entwicklung mit React Native aus dieser Lektion.
Zusammenfassung der Lektion
In dieser Lektion haben Sie gelernt: Die Expo Push API akzeptiert POST-Anfragen an exp.host mit den Feldern token, title, body und data, um Benachrichtigungen über APNs/FCM zu senden, Push-Empfangsbestätigungen bestätigen die tatsächliche Zustellung, und DeviceNotRegistered-Fehler weisen darauf hin, dass Tokens gelöscht werden müssen, und lokale Benachrichtigungen können direkt in der App mit Notifications.scheduleNotificationAsync und zeitbasierten Triggern geplant werden. Als Nächstes verarbeiten wir Ereignisse für Benachrichtigungen im Vorder- und Hintergrund innerhalb der App.
Lerne JavaScript mit einem KI-Tutor — kostenlos
Schreibe und führe echten Code in deinem Browser aus, bekomme sofortige Hilfe von einem 24/7 KI-Tutor und setze dein Lernen im Web oder in der App fort.
- Kurse
- 30
- Lektionen
- 120
Häufig gestellte Fragen
Ist die Lektion „Benachrichtigungen über die Expo Push API senden“ kostenlos?
Ja — der vollständige Text von „Benachrichtigungen über die Expo Push API senden“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des React Native Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der React Native Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Benachrichtigungen über die Expo Push API senden“?
Senden Sie eine Benachrichtigungs-Payload per POST von Ihrem Server oder einem curl-Befehl an die Expo Push API, adressieren Sie ein bestimmtes Gerät anhand seines Tokens und überprüfen Sie die Zuste… Du übst React Native Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um React Native Academy zu starten?
Keine Vorkenntnisse erforderlich. React Native Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 2 von 4.
Wie lange dauert die Lektion „Benachrichtigungen über die Expo Push API senden“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser React Native Academy-Lektion Code schreiben und ausführen?
Ja. Jede React Native Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Berechtigungen anfordern und einen Push-Token abrufen
- Benachrichtigungen über die Expo Push API senden
- Benachrichtigungen im Vorder- und Hintergrund verarbeiten
- Benachrichtigungskanäle und Rich Content