`Notification` în JavaScript

Stocare și dispozitiv Browserele moderne (iOS: doar aplicații web instalate)

Afișează notificări ale sistemului de operare, după ce utilizatorul a dat permisiunea.

Sintaxă

const permisiune = await Notification.requestPermission();
new Notification(titlu, { body, icon })

Ce face `Notification`

Notification.requestPermission() cere permisiunea și returnează "granted", "denied" sau "default" (fereastra a fost închisă). Starea curentă este în Notification.permission. Cererea trebuie făcută după un clic.

După acordare, new Notification(titlu, optiuni) afișează notificarea, cu text (body), pictogramă (icon) și eveniment click. Notificările care vin când site-ul este închis (push) au nevoie de un service worker.

Parametri

Parametru	Descriere
`titlu`	Titlul notificării.
`optiuni`	Opțional. `body`, `icon`, `tag`, `data`…

Ce returnează

requestPermission: o Promise cu starea. Constructorul: un obiect Notification.

Exemple

Exemplul 1: O notificare după o comandă

document.querySelector("#activeaza").addEventListener("click", async () => {
  const permisiune = await Notification.requestPermission();
  console.log(permisiune);
  if (permisiune !== "granted") return;

  const n = new Notification("Comanda #1042 a fost expediată", {
    body: "Curierul ajunge mâine între 10 și 14.",
    icon: "/icon-192.png",
  });
  n.addEventListener("click", () => window.focus());
});

Rezultat în browser

granted

Greșeli frecvente

Ceri permisiunea imediat la intrarea pe site. Majoritatea utilizatorilor refuză, iar după refuz nu mai poți cere din nou din pagină.

Comenzi înrudite

navigator.serviceWorker.register / caches.open: Instalează un service worker (pentru funcționare offline și notificări push) și lucrează cu cache-ul lui.
navigator.vibrate: Face telefonul să vibreze: o dată sau după un model de vibrații și pauze.
alert: Afișează o fereastră simplă cu un mesaj și butonul OK; oprește pagina până la închidere.

Ce face Notification