Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
Notification
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Sicherer Kontext: Diese Funktion ist nur insicheren Kontexten (HTTPS) in einigen oder allenunterstützenden Browsern verfügbar.
Hinweis: Diese Funktion ist inWeb Workers verfügbar.
DasNotification-Interface derBenachrichtigungen-API wird verwendet, um Desktop-Benachrichtigungen für den Benutzer zu konfigurieren und anzuzeigen.
Das Erscheinungsbild und die spezifischen Funktionen dieser Benachrichtigungen variieren je nach Plattform, bieten jedoch im Allgemeinen eine Möglichkeit, dem Benutzer asynchron Informationen bereitzustellen.
In diesem Artikel
Konstruktor
Notification()Erstellt eine neue Instanz des
Notification-Objekts.
Statische Eigenschaften
Erbt auch Eigenschaften von seinem übergeordneten Interface,EventTarget.
Notification.permissionSchreibgeschütztEin String, der die aktuelle Berechtigung zur Anzeige von Benachrichtigungen darstellt. Mögliche Werte sind:
denied— Der Benutzer lehnt es ab, Benachrichtigungen anzuzeigen.granted— Der Benutzer stimmt zu, Benachrichtigungen anzuzeigen.default— Die Wahl des Benutzers ist unbekannt und der Browser verhält sich daher so, als wäre der Wertdenied.
Notification.maxActionsSchreibgeschütztExperimentellDie maximale Anzahl von Aktionen, die vom Gerät und dem User-Agent unterstützt werden.
Instanz-Eigenschaften
Erbt auch Eigenschaften von seinem übergeordneten Interface,EventTarget.
Notification.actionsSchreibgeschütztExperimentellDas Aktionsarray der Benachrichtigung, wie im
options-Parameter des Konstruktors angegeben.Notification.badgeSchreibgeschütztEin String, der die URL eines Bildes enthält, um die Benachrichtigung zu repräsentieren, wenn nicht genügend Platz vorhanden ist, um die Benachrichtigung selbst anzuzeigen, wie beispielsweise in der Android-Benachrichtigungsleiste. Auf Android-Geräten sollte das Badge Geräte bis zu 4x Auflösung unterstützen, etwa 96 x 96 px, und das Bild wird automatisch maskiert.
Notification.bodySchreibgeschütztDer Body-String der Benachrichtigung, wie im
options-Parameter des Konstruktors angegeben.Notification.dataSchreibgeschütztGibt einen strukturierten Klon der Daten der Benachrichtigung zurück.
Notification.dirSchreibgeschütztDie Textausrichtung der Benachrichtigung, wie im
options-Parameter des Konstruktors angegeben.Notification.iconSchreibgeschütztDie URL des Bildes, das als Symbol der Benachrichtigung verwendet wird, wie im
options-Parameter des Konstruktors angegeben.Notification.imageSchreibgeschütztExperimentellDie URL eines Bildes, das als Teil der Benachrichtigung angezeigt wird, wie im
options-Parameter des Konstruktors angegeben.Notification.langSchreibgeschütztDer Sprachcode der Benachrichtigung, wie im
options-Parameter des Konstruktors angegeben.Notification.renotifySchreibgeschütztExperimentellGibt an, ob der Benutzer benachrichtigt werden soll, wenn eine neue Benachrichtigung eine alte ersetzt.
Notification.requireInteractionSchreibgeschütztEin boolescher Wert, der angibt, dass eine Benachrichtigung aktiv bleiben sollte, bis der Benutzer sie anklickt oder schließt, anstatt automatisch zu schließen.
Notification.silentSchreibgeschütztGibt an, ob die Benachrichtigung stumm sein sollte – d.h. es sollten unabhängig von den Geräteeinstellungen keine Geräusche oder Vibrationen ausgegeben werden.
Notification.tagSchreibgeschütztDie ID der Benachrichtigung (falls vorhanden), wie im
options-Parameter des Konstruktors angegeben.Notification.timestampSchreibgeschütztExperimentellGibt die Zeit an, zu der eine Benachrichtigung erstellt oder anwendbar ist (Vergangenheit, Gegenwart oder Zukunft).
Notification.titleSchreibgeschütztDer Titel der Benachrichtigung, wie im ersten Parameter des Konstruktors angegeben.
Notification.vibrateSchreibgeschütztExperimentellGibt ein Vibrationsmuster für Geräte mit Vibrationshardware an, das ausgegeben wird.
Statische Methoden
Erbt auch Methoden von seinem übergeordneten Interface,EventTarget.
Notification.requestPermission()Fordert die Erlaubnis vom Benutzer an, Benachrichtigungen anzuzeigen.
Instanz-Methoden
Erbt auch Methoden von seinem übergeordneten Interface,EventTarget.
Notification.close()Schließt eine Benachrichtigungsinstanz programmgesteuert.
Ereignisse
Erbt auch Ereignisse von seinem übergeordneten Interface,EventTarget.
Beispiele
Angenommen, dieser grundlegende HTML-Code:
<button>Notify me!</button>Es ist möglich, eine Benachrichtigung wie folgt zu senden — hier präsentieren wir eine recht ausführliche und vollständige Reihe von Code, die Sie verwenden könnten, wenn Sie zuerst überprüfen möchten, ob Benachrichtigungen unterstützt werden, dann überprüfen, ob die Berechtigung für den aktuellen Ursprung erteilt wurde, Benachrichtigungen zu senden, dann die Berechtigung anfordern, falls erforderlich, bevor Sie dann eine Benachrichtigung senden.
document.querySelector("button").addEventListener("click", notifyMe);function notifyMe() { if (!("Notification" in window)) { // Check if the browser supports notifications alert("This browser does not support desktop notification"); } else if (Notification.permission === "granted") { // Check whether notification permissions have already been granted; // if so, create a notification const notification = new Notification("Hi there!"); // … } else if (Notification.permission !== "denied") { // We need to ask the user for permission Notification.requestPermission().then((permission) => { // If the user accepts, let's create a notification if (permission === "granted") { const notification = new Notification("Hi there!"); // … } }); } // At last, if the user has denied notifications, and you // want to be respectful there is no need to bother them anymore.}Wir zeigen kein Live-Beispiel mehr auf dieser Seite, da Chrome und Firefox keine Benachrichtigungsberechtigungen mehr von fremden Ursprüngen aus anfordern lassen, mit anderen Browsern, die folgen werden. Um ein Beispiel in Aktion zu sehen, schauen Sie sich unserTo-do-Listenbeispiel an (sehen Sie auchdie App live in Aktion).<iframe>s
Hinweis:Im obigen Beispiel erstellen wir Benachrichtigungen als Reaktion auf eine Benutzeraktion (Klick auf einen Button). Dies ist nicht nur Best Practice – Sie sollten Benutzer nicht mit Benachrichtigungen belästigen, denen sie nicht zugestimmt haben – sondern in Zukunft werden Browser ausdrücklich Benachrichtigungen verbieten, die nicht als Reaktion auf eine Benutzeraktion ausgelöst werden. Firefox tut dies bereits ab Version 72, zum Beispiel.
Spezifikationen
| Specification |
|---|
| Notifications API> # api> |