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 konkreten Funktionen dieser Benachrichtigungen unterscheiden sich je nach Plattform. Im Allgemeinen ermöglichen sie es jedoch, Benutzern asynchron Informationen bereitzustellen.

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. Daher verhält sich der Browser so, als wäre der Wert denied.

Notification.maxActions Schreibgeschützt

Die maximale Anzahl von Aktionen, die vom Gerät und vom User Agent unterstützt werden.

Instanzeigenschaften

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

Notification.actions Schreibgeschützt: Das Array mit den 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 Icon 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. Wenn sie festgelegt ist, führt das Aktivieren 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, ob eine Benachrichtigung aktiv bleiben soll, bis der Benutzer sie anklickt oder schließt, statt automatisch geschlossen zu werden.
Notification.silent Schreibgeschützt: Gibt an, ob die Benachrichtigung lautlos sein soll – also 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 relevant ist (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 für Geräte mit Vibrationshardware an.

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 diesem einfachen HTML aus:

html

<button>Notify me!</button>

Eine Benachrichtigung lässt sich wie folgt senden. Das folgende, recht ausführliche und vollständige Codebeispiel zeigt, wie Sie zunächst prüfen können, ob Benachrichtigungen unterstützt werden und ob für die aktuelle Origin bereits die Berechtigung zum Senden von Benachrichtigungen 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 interaktives Beispiel mehr, da Chrome und Firefox nicht mehr zulassen, dass die Berechtigung für Benachrichtigungen aus <iframe>s mit anderer Origin angefordert wird. Andere Browser werden voraussichtlich folgen. Ein funktionierendes Beispiel finden Sie in unserem Beispiel für eine Aufgabenliste (siehe auch die laufende Anwendung).

Hinweis: Im obigen Beispiel lösen wir Benachrichtigungen als Reaktion auf eine Benutzeraktion aus (einen Klick auf eine Schaltfläche). Das ist nicht nur eine bewährte Vorgehensweise – Sie sollten Benutzer nicht mit Benachrichtigungen überhäufen, denen sie nicht zugestimmt haben. Künftig werden Browser Benachrichtigungen, die nicht durch eine Benutzeraktion ausgelöst wurden, ausdrücklich unterbinden. 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