Notification: error — Ereignis · JavaScript-Referenz

Signatur

notification.addEventListener("error", handler)

Beschreibung

Das error-Ereignis des Notification-Interfaces wird ausgelöst, wenn beim Erstellen oder Anzeigen einer Benachrichtigung ein Fehler passiert. Typische Gründe sind eine fehlende oder zurückgezogene Berechtigung (Notification.permission ist "denied"), ein Aufruf von new Notification() ohne Erlaubnis oder ein Problem im Benachrichtigungssystem des Betriebssystems.

Einen Handler registriert man mit addEventListener("error", handler) oder über die Eigenschaft notification.onerror = handler. Übergeben wird ein einfaches Event-Objekt. Es enthält keine genaueren Angaben zur Fehlerursache, anders als etwa ErrorEvent. Das Ereignis steigt nicht auf (bubbling) und lässt sich nicht abbrechen.

Nutzen Sie das Ereignis, um eine Ausweichlösung bereitzustellen, zum Beispiel einen Hinweis direkt in der Seite (ein „Toast“), wenn keine Systembenachrichtigung erscheinen kann. Außerdem eignet es sich, um Fehler zu protokollieren.

Parameter

Name	Typ	Default	Beschreibung
$type Pflicht	string		Der Ereignisname, hier immer `"error"`.
$handler Pflicht	(event: Event) => void		Die Rückruffunktion. Sie bekommt ein allgemeines `Event`, dessen `target` die betroffene `Notification` ist.
$options	boolean \| AddEventListenerOptions	false	Optionale Einstellungen wie `once` oder `signal` (zum Entfernen über einen `AbortController`).

Rückgabewert

Typ

void

Beschreibung

addEventListener gibt nichts zurück. Die Eigenschaft onerror liefert den aktuell gesetzten Handler oder null.

Beispiele

Fehler mit addEventListener abfangen und Ausweichlösung zeigen

const showInPageToast = (text) => {
  const toast = document.createElement('div');
  toast.className = 'toast';
  toast.textContent = text;
  document.body.append(toast);
  setTimeout(() => toast.remove(), 4000);
};

const notify = async (title, body) => {
  if (!('Notification' in window)) {
    showInPageToast(`${title}: ${body}`);
    return;
  }
  const permission = await Notification.requestPermission();
  if (permission !== 'granted') {
    showInPageToast(`${title}: ${body}`);
    return;
  }
  const n = new Notification(title, { body });
  n.addEventListener('error', (event) => {
    console.warn('Benachrichtigung fehlgeschlagen:', event.type);
    showInPageToast(`${title}: ${body}`);
  }, { once: true });
};

notify('Neue Nachricht', 'Anna hat dir geschrieben.');

Benachrichtigung fehlgeschlagen: error (nur wenn die Anzeige scheitert)

Handler über die onerror-Eigenschaft setzen

const n = new Notification('Build abgeschlossen', {
  body: 'Alle Tests erfolgreich.',
  tag: 'build-status'
});

n.onerror = (event) => {
  console.error('Fehler bei Benachrichtigung:', event.target.title);
};

// Handler später wieder entfernen
// n.onerror = null;

Fehler bei Benachrichtigung: Build abgeschlossen

Listener mit AbortController entfernen

const controller = new AbortController();
const n = new Notification('Erinnerung', { body: 'Meeting in 5 Minuten' });

const onError = () => console.log('Anzeige fehlgeschlagen');
n.addEventListener('error', onError, { signal: controller.signal });
n.addEventListener('show', () => console.log('Angezeigt'));

// Nach erfolgreicher Anzeige ist der Fehler-Handler überflüssig
n.addEventListener('show', () => controller.abort(), { once: true });

// Alternativ ohne AbortController:
// n.removeEventListener('error', onError);

Angezeigt

// Wichtig · Fallstricke

Keine Fehlerdetails: Der Handler bekommt ein allgemeines Event ohne message oder Fehlercode. Die Ursache müssen Sie selbst herleiten, etwa über Notification.permission.
Berechtigung zuerst prüfen: Ob bei fehlender Berechtigung error ausgelöst wird oder gar nichts passiert, unterscheidet sich je nach Browser. Rufen Sie deshalb vor new Notification() immer Notification.requestPermission() auf oder prüfen Sie Notification.permission.
Nur in sicheren Kontexten: Die Notifications API funktioniert nur über HTTPS bzw. localhost. Viele Browser erlauben die Anfrage nach der Berechtigung außerdem nur nach einer Nutzeraktion, etwa einem Klick.
Mobilgeräte und Service Worker: In Chrome für Android wirft der Konstruktor new Notification() einen TypeError. Dort muss man ServiceWorkerRegistration.showNotification() verwenden. Solche Benachrichtigungen lösen kein error-Ereignis auf dem Objekt aus; Fehler erscheinen stattdessen als abgelehntes Promise. Safari auf iOS unterstützt Benachrichtigungen nur für Web-Apps, die zum Home-Bildschirm hinzugefügt wurden (ab iOS 16.4).
Registrieren Sie den Handler direkt nach dem Konstruktor-Aufruf, im selben synchronen Codeabschnitt, damit Sie kein früh ausgelöstes Ereignis verpassen.

Siehe auch

Notification Notification.requestPermission() Notification.permission ServiceWorkerRegistration.showNotification() Notification: show