Start · Sprachen · JavaScript · Referenz · Notification.body

Notification.body

Eigenschaft

Schreibgeschützte Eigenschaft, die den Textkörper einer Benachrichtigung liefert, so wie er in der <code>body</code>-Option des <code>Notification()</code>-Konstruktors angegeben wurde.

seit JavaScript Baseline: alle modernen Browser (Chrome 22+, Firef Kategorie: webapi

Signatur

Notification.prototype.body

Beschreibung

Die Eigenschaft body einer Notification-Instanz enthält den Fließtext, der unter dem Titel der Systembenachrichtigung angezeigt wird. Der Wert wird ausschließlich beim Erzeugen über die Option body im Konstruktor new Notification(title, options) bzw. über ServiceWorkerRegistration.showNotification() gesetzt.

Die Eigenschaft ist schreibgeschützt: Eine Zuweisung ändert weder den Wert noch die schon angezeigte Benachrichtigung. Soll ein anderer Text erscheinen, erzeugt man eine neue Benachrichtigung. Mit demselben tag ersetzt sie die alte.

Praktisch nützlich ist body vor allem beim Auswerten von Benachrichtigungen, z. B. in Event-Handlern wie click oder close, beim Protokollieren oder im Service Worker, wenn man über getNotifications() bestehende Benachrichtigungen durchsucht.

Rückgabewert

Typ
string
Beschreibung
Der Textkörper der Benachrichtigung. Wurde keine body-Option angegeben, ist es ein leerer String "".

Beispiele

Benachrichtigung erzeugen und body auslesen

const zeigeHinweis = async () => {
  const erlaubnis = await Notification.requestPermission();
  if (erlaubnis !== 'granted') return;

  const n = new Notification('Neue Nachricht', {
    body: 'Anna: Treffen wir uns um 15 Uhr?'
  });
  console.log(n.body);
};

zeigeHinweis();
Anna: Treffen wir uns um 15 Uhr?

body im click-Handler auswerten

const n = new Notification('Build fertig', {
  body: 'Projekt „shop-frontend“ erfolgreich gebaut.',
  tag: 'build-status'
});

n.addEventListener('click', (event) => {
  console.log(`Angeklickt: ${event.target.body}`);
  window.focus();
  n.close();
});
Angeklickt: Projekt „shop-frontend“ erfolgreich gebaut.

Im Service Worker bestehende Benachrichtigungen durchsuchen

// service-worker.js
self.addEventListener('message', async (event) => {
  const offene = await self.registration.getNotifications();
  const treffer = offene.filter((n) => n.body.includes('Bestellung'));
  treffer.forEach((n) => n.close());
  console.log(`${treffer.length} Bestell-Hinweise geschlossen`);
});
2 Bestell-Hinweise geschlossen

Schreibschutz und leerer Standardwert

const n = new Notification('Nur Titel');
console.log(JSON.stringify(n.body));

n.body = 'Neuer Text'; // wird ignoriert (im Strict Mode kein Fehler, da Getter auf dem Prototyp)
console.log(JSON.stringify(n.body));
"" ""

// Wichtig · Fallstricke

  • Schreibgeschützt: Zuweisungen werden stillschweigend ignoriert (im Strict Mode wird ein TypeError ausgelöst, weil es nur einen Getter gibt). Neuen Text gibt man mit einer neuen Benachrichtigung aus, bei gleichem tag ersetzt sie die alte.
  • Nur Klartext: HTML wird nicht interpretiert, sondern als Text angezeigt. Ein XSS-Risiko besteht in der Benachrichtigung selbst deshalb nicht. Wer body später aber per innerHTML in die Seite schreibt, muss den Text maskieren oder textContent verwenden.
  • Darstellung: Das Betriebssystem kürzt lange Texte oft. Wie viele Zeichen sichtbar bleiben, hängt vom System ab (Windows, macOS, Android).
  • Kompatibilität: Benachrichtigungen funktionieren nur in sicheren Kontexten (HTTPS) und erst nach erteilter Erlaubnis. Chrome auf Android unterstützt den Konstruktor new Notification() nicht, dort muss man ServiceWorkerRegistration.showNotification() verwenden. Safari auf iOS unterstützt Benachrichtigungen erst ab 16.4 und nur für Web-Apps, die zum Home-Bildschirm hinzugefügt wurden.