Notification

Eingeschränkt verfügbar

Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.

Want more browser support for this feature? Tell us why.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Die Notification-Schnittstelle der Notifications API wird verwendet, um Desktop-Benachrichtigungen für Benutzer zu konfigurieren und anzuzeigen.

Das Erscheinungsbild und die konkrete Funktionsweise dieser Benachrichtigungen unterscheiden sich je nach Plattform. Im Allgemeinen bieten sie jedoch eine Möglichkeit, Benutzer asynchron zu informieren.

Konstruktor

Notification(): Erstellt eine neue Instanz des Notification-Objekts.

Statische Eigenschaften

Erbt außerdem Eigenschaften von der übergeordneten Schnittstelle EventTarget.

Notification.permission Schreibgeschützt

Ein String, der die aktuelle Berechtigung zum Anzeigen von Benachrichtigungen angibt. Mögliche Werte sind:

denied — Der Benutzer lehnt die Anzeige von Benachrichtigungen ab.
granted — Der Benutzer stimmt der Anzeige von Benachrichtigungen zu.
default — Die Entscheidung des Benutzers ist unbekannt. Der Browser verhält sich daher so, als wäre die Berechtigung verweigert worden.

Notification.maxActions Schreibgeschützt

Die maximale Anzahl von Aktionen, die das Gerät und der User Agent unterstützen.

Instanzeigenschaften

Erbt außerdem Eigenschaften von der übergeordneten Schnittstelle EventTarget.

Notification.actions Schreibgeschützt: Das Array der Aktionen der Benachrichtigung, wie im Parameter options des Konstruktors angegeben.
Notification.badge Schreibgeschützt: Ein String mit der URL eines Bildes, das die Benachrichtigung repräsentiert, wenn nicht genügend Platz vorhanden ist, um die Benachrichtigung selbst anzuzeigen, beispielsweise in der Android-Benachrichtigungsleiste. Auf Android-Geräten sollte das Badge für Geräte mit bis zu vierfacher Auflösung ausgelegt sein, also etwa 96 × 96 px. Das Bild wird automatisch maskiert.
Notification.body Schreibgeschützt: Der Text der Benachrichtigung, wie im Parameter options des Konstruktors angegeben.
Notification.data Schreibgeschützt: Gibt einen strukturierten Klon der Daten der Benachrichtigung zurück.
Notification.dir Schreibgeschützt: Die Textrichtung der Benachrichtigung, wie im Parameter options des Konstruktors angegeben.
Notification.icon Schreibgeschützt: Die URL des Bildes, das als Symbol der Benachrichtigung verwendet wird, wie im Parameter options des Konstruktors angegeben.
Notification.image Schreibgeschützt: Die URL eines Bildes, das als Teil der Benachrichtigung angezeigt wird, wie im Parameter options des Konstruktors angegeben.
Notification.lang Schreibgeschützt: Der Sprachcode der Benachrichtigung, wie im Parameter options des Konstruktors angegeben.
Notification.navigate Schreibgeschützt: Die Navigations-URL der Benachrichtigung. Ist sie festgelegt, führt die Aktivierung der Benachrichtigung zu dieser URL, statt das Ereignis click oder notificationclick auszulösen.
Notification.renotify Schreibgeschützt: Gibt an, ob der Benutzer benachrichtigt werden soll, nachdem eine neue Benachrichtigung eine alte ersetzt hat.
Notification.requireInteraction Schreibgeschützt: Ein boolescher Wert, der angibt, dass eine Benachrichtigung aktiv bleiben soll, bis der Benutzer darauf klickt oder sie schließt, statt automatisch geschlossen zu werden.
Notification.silent Schreibgeschützt: Gibt an, ob die Benachrichtigung lautlos sein soll – das heißt, unabhängig von den Geräteeinstellungen weder Töne noch Vibrationen auslösen soll.
Notification.tag Schreibgeschützt: Die ID der Benachrichtigung (falls vorhanden), wie im Parameter options des Konstruktors angegeben.
Notification.timestamp Schreibgeschützt: Gibt den Zeitpunkt an, zu dem eine Benachrichtigung erstellt wird oder für den sie gilt (in der Vergangenheit, Gegenwart oder Zukunft).
Notification.title Schreibgeschützt: Der Titel der Benachrichtigung, wie im ersten Parameter des Konstruktors angegeben.
Notification.vibrate Schreibgeschützt: Gibt ein Vibrationsmuster an, das Geräte mit Vibrationshardware ausgeben sollen.

Statische Methoden

Erbt außerdem Methoden von der übergeordneten Schnittstelle EventTarget.

Notification.requestPermission(): Fordert vom Benutzer die Berechtigung zum Anzeigen von Benachrichtigungen an.

Instanzmethoden

Erbt außerdem Methoden von der übergeordneten Schnittstelle EventTarget.

Notification.close(): Schließt eine Benachrichtigungsinstanz programmgesteuert.

Ereignisse

Erbt außerdem Ereignisse von der übergeordneten Schnittstelle EventTarget.

click: Wird ausgelöst, wenn der Benutzer auf die Benachrichtigung klickt.
close: Wird ausgelöst, wenn der Benutzer die Benachrichtigung schließt.
error: Wird ausgelöst, wenn bei der Benachrichtigung ein Fehler auftritt.
show: Wird ausgelöst, wenn die Benachrichtigung angezeigt wird.

Beispiele

Gehen Sie von folgendem einfachen HTML aus:

html

<button>Notify me!</button>

Eine Benachrichtigung lässt sich wie folgt senden. Hier zeigen wir ein recht ausführliches und vollständiges Codebeispiel: Zunächst wird geprüft, ob Benachrichtigungen unterstützt werden und ob der aktuellen Origin die Berechtigung zum Senden von Benachrichtigungen bereits erteilt wurde. Falls erforderlich, wird die Berechtigung angefordert, bevor die Benachrichtigung gesendet wird.

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.
}

Auf dieser Seite zeigen wir kein direkt ausführbares Beispiel mehr, da Chrome und Firefox nicht mehr zulassen, dass Berechtigungen für Benachrichtigungen aus <iframe>s mit einer anderen Origin angefordert werden. Andere Browser werden voraussichtlich folgen. Ein Beispiel in Aktion finden Sie in unserem Beispiel einer Aufgabenliste (siehe auch die laufende Anwendung).

Hinweis: Im obigen Beispiel werden Benachrichtigungen als Reaktion auf eine Benutzeraktion (einen Klick auf eine Schaltfläche) erzeugt. Das ist nicht nur empfehlenswert – Sie sollten Benutzer nicht mit Benachrichtigungen überhäufen, denen sie nicht zugestimmt haben –, sondern Browser werden künftig Benachrichtigungen ausdrücklich unterbinden, die nicht durch eine Benutzeraktion ausgelöst wurden. Firefox tut dies beispielsweise bereits seit Version 72.

Spezifikationen

Spezifikation
Notifications API # notification

Browser-Kompatibilität

Siehe auch

Verwendung der Notifications API

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden