Notification Triggers API

Mit Triggern für Benachrichtigungen können Sie lokale Benachrichtigungen planen, für die keine Netzwerkverbindung erforderlich ist. Daher sind sie ideal für Anwendungsfälle wie Kalender-Apps.

Was sind Benachrichtigungsauslöser?

Webentwickler können Benachrichtigungen mithilfe der Web Notifications API anzeigen lassen. Diese Funktion wird häufig mit der Push API verwendet, um den Nutzer über zeitkritische Informationen wie Eilmeldungen oder empfangene Nachrichten zu informieren. Benachrichtigungen werden angezeigt, indem JavaScript auf dem Gerät des Nutzers ausgeführt wird.

Das Problem an der Push API besteht darin, dass sie nicht zuverlässig ist, um Benachrichtigungen auszulösen, die angezeigt werden müssen, wenn eine bestimmte Bedingung, z. B. Zeit oder Ort, erfüllt ist. Ein Beispiel für eine zeitbasierte Bedingung ist eine Kalenderbenachrichtigung, die Sie an eine wichtige Besprechung mit Ihrem Chef um 14 Uhr erinnert. Ein Beispiel für eine standortbasierte Bedingung ist eine Benachrichtigung, die Sie daran erinnert, Milch zu kaufen, wenn Sie sich in der Nähe eines Lebensmittelgeschäfts befinden. Die Netzwerkverbindung oder akkusparende Funktionen wie der Stromsparmodus können die Zustellung von Push-basierten Benachrichtigungen verzögern.

Benachrichtigungstrigger lösen dieses Problem, indem Sie Benachrichtigungen mit ihrem Auslösezustand im Voraus planen können, sodass das Betriebssystem die Benachrichtigung zum richtigen Zeitpunkt sendet, auch wenn keine Netzwerkverbindung besteht oder das Gerät im Energiesparmodus ist.

Anwendungsfälle

Kalenderanwendungen können Nutzer mithilfe von zeitbasierten Benachrichtigungsauslösern an anstehende Besprechungen erinnern. Das Standardbenachrichtigungsschema für eine Kalenderanwendung könnte sein, eine erste Vorabbenachrichtigung eine Stunde vor einer Besprechung und dann eine weitere dringende Benachrichtigung fünf Minuten vorher anzuzeigen.

Ein Fernsehsender erinnert Nutzer möglicherweise daran, dass ihre Lieblingsfernsehsendung beginnt oder der Livestream einer Konferenz beginnt.

Websites mit Zeitzonenkonvertierungen können zeitbasierte Trigger für Benachrichtigungen verwenden, damit Nutzer Wecker für Telefonkonferenzen oder Videoanrufe planen können.

Aktueller Status

Step	Status
1. Erklärende Erklärung erstellen	Abschließen
2. Ersten Entwurf der Spezifikation erstellen	Nicht gestartet
3. Feedback einholen und das Design iterieren.	In Bearbeitung
4. Ursprungstest	Abschließen
5. Einführung	Nicht gestartet

Benachrichtigungstrigger verwenden

Aktivierung über about://flags

Wenn Sie die Notification Triggers API lokal ohne Ursprungstesttoken testen möchten, aktivieren Sie das Flag #enable-experimental-web-platform-features in about://flags.

Funktionserkennung

Sie können herausfinden, ob der Browser Benachrichtigungstrigger unterstützt, indem Sie prüfen, ob das Attribut showTrigger vorhanden ist:

if ('showTrigger' in Notification.prototype) {
  /* Notification Triggers supported */
}

Benachrichtigung planen

Das Planen einer Benachrichtigung ähnelt der Anzeige einer normalen Push-Benachrichtigung, mit der Ausnahme, dass Sie ein showTrigger-Bedingungsattribut mit einem TimestampTrigger-Objekt als Wert an das options-Objekt der Benachrichtigung übergeben müssen.

const createScheduledNotification = async (tag, title, timestamp) => {
  const registration = await navigator.serviceWorker.getRegistration();
  registration.showNotification(title, {
    tag: tag,
    body: 'This notification was scheduled 30 seconds ago',
    showTrigger: new TimestampTrigger(timestamp + 30 * 1000),
  });
};

Geplante Benachrichtigung abbrechen

Wenn Sie geplante Benachrichtigungen deaktivieren möchten, fordern Sie zuerst über ServiceWorkerRegistration.getNotifications() eine Liste aller Benachrichtigungen an, die einem bestimmten Tag entsprechen. Beachten Sie, dass Sie das Flag includeTriggered übergeben müssen, damit geplante Benachrichtigungen in die Liste aufgenommen werden:

const cancelScheduledNotification = async (tag) => {
  const registration = await navigator.serviceWorker.getRegistration();
  const notifications = await registration.getNotifications({
    tag: tag,
    includeTriggered: true,
  });
  notifications.forEach((notification) => notification.close());
};

Debugging

Über den Benachrichtigungsbereich der Chrome-Entwicklertools können Sie Fehler in Benachrichtigungen beheben. Drücken Sie zum Starten der Fehlerbehebung Ereignisse aufzeichnen oder Strg + E (Befehlstaste + E auf einem Mac). Die Chrome-Entwicklertools erfassen alle Benachrichtigungsereignisse, einschließlich geplanter, angezeigter und geschlossener Benachrichtigungen, drei Tage lang, auch wenn die Entwicklertools geschlossen sind.

Demo

In der Demo können Sie Benachrichtigungstrigger in Aktion sehen. Damit können Sie Benachrichtigungen planen, geplante Benachrichtigungen auflisten und abbrechen. Der Quellcode ist auf Glitch verfügbar.

Sicherheit und Berechtigungen

Das Chrome-Team hat die Notification Triggers API auf der Grundlage der Grundprinzipien entwickelt und implementiert, die unter Zugriff auf leistungsstarke Webplattformfunktionen steuern, einschließlich Nutzersteuerung, Transparenz und Ergonomie, definiert wurden. Da für diese API Service Worker erforderlich sind, ist auch ein sicherer Kontext erforderlich. Für die Verwendung der API ist dieselbe Berechtigung wie für normale Push-Benachrichtigungen erforderlich.

Nutzersteuerung

Diese API ist nur in Verbindung mit ServiceWorkerRegistration verfügbar. Dies bedeutet, dass alle erforderlichen Daten im selben Kontext gespeichert und automatisch gelöscht werden, wenn der Service Worker oder der Nutzer alle Websitedaten für den Ursprung löscht. Durch das Blockieren von Cookies wird außerdem verhindert, dass Service-Worker in Chrome installiert werden und somit diese API nicht verwendet wird. Benachrichtigungen können vom Nutzer immer in den Websiteeinstellungen für die Website deaktiviert werden.

Transparenz

Im Gegensatz zur Push API ist diese API nicht vom Netzwerk abhängig. Daher benötigen geplante Benachrichtigungen vorab alle erforderlichen Daten, einschließlich Bildressourcen, auf die in den Attributen badge, icon und image verwiesen wird. Das bedeutet, dass der Entwickler eine geplante Benachrichtigung nicht sehen kann und der Service Worker nicht aktiviert wird, bis der Nutzer mit der Benachrichtigung interagiert. Daher ist es derzeit nicht bekannt, wie der Entwickler durch potenziell datenschutzkonforme Ansätze wie die Standortsuche anhand von IP-Adressen Informationen über den Nutzer erhalten kann. Bei diesem Design kann die Funktion auch optional auf Planungsmechanismen des Betriebssystems wie AlarmManager von Android zurückgreifen, um den Akku zu schonen.

Feedback

Das Chrome-Team möchte mehr über Ihre Erfahrungen mit Benachrichtigungsauslösern erfahren.

Informationen zum API-Design

Gibt es etwas an der API, das nicht wie erwartet funktioniert? Oder fehlen Methoden oder Eigenschaften, um Ihre Idee umzusetzen? Haben Sie eine Frage oder einen Kommentar zum Sicherheitsmodell? Melden Sie ein Spezifikationsproblem im GitHub-Repository für Benachrichtigungsauslöser oder ergänzen Sie ein vorhandenes Problem.

Probleme bei der Implementierung?

Haben Sie bei der Implementierung von Chrome einen Fehler gefunden? Oder unterscheidet sich die Implementierung von der Spezifikation? Melden Sie Fehler unter new.crbug.com. Geben Sie dabei so viele Details wie möglich an, führen Sie eine einfache Anleitung zum Reproduzieren aus und setzen Sie für Komponenten UI>Notifications. Mit Glitch lassen sich Fehler schnell und einfach reproduzieren.

Möchten Sie die API verwenden?

Möchten Sie Benachrichtigungs-Trigger auf Ihrer Website verwenden? Ihre öffentliche Unterstützung hilft uns bei der Priorisierung von Funktionen und zeigt anderen Browseranbietern, wie wichtig es ist, sie zu unterstützen. Sende einen Tweet an @ChromiumDev mit dem Hashtag #NotificationTriggers und teile uns mit, wo und wie du es verwendest.

Hilfreiche Links

• Öffentliche Erklärung
• Demoquelle zu Benachrichtigungsauslösern | Demoquelle für Benachrichtigungstrigger
• Tracking-Fehler
• ChromeStatus.com-Eintrag
• Blink-Komponente: UI>Notifications

Danksagungen

Die Benachrichtigungstrigger wurden von Richard Knoll und dem erklärenden von Peter Beverloo mit Beiträgen von Richard implementiert. Die folgenden Personen haben den Artikel gelesen: Joe Medley, Pete LePage sowie Richard und Peter. Hero-Image von Lukas Blazek bei Unsplash.