Notification()

Note : Cette fonctionnalité est disponible via les Web Workers.

Contexte sécurisé
Cette fonctionnalité est uniquement disponible dans des contextes sécurisés (HTTPS), pour certains navigateurs qui la prennent en charge.

Le constructeur Notification() crée une nouvelle instance d'objet Notification, qui représente une notification utilisateur.

Syntaxe

const myNotification = new Notification(title, options)

Paramètres

title
Définit un titre pour la notification, qui s'affiche en haut de la fenêtre de notification.
options Facultatif
Un objet d'options contenant tous les paramètres personnalisés que vous souhaitez appliquer à la notification. Les options possibles sont:
  • dir: La direction dans laquelle afficher la notification. La valeur par défaut est auto, qui adopte simplement le comportement du paramètre de langue du navigateur, mais vous pouvez remplacer ce comportement en définissant les valeurs de ltr et rtl (bien que la plupart des navigateurs semblent ignorer ces paramètres.)
  • lang: La langue de la notification, telle que spécifiée à l'aide d'un DOMString représentant une balise de langue BCP 47. Consultez la page des codes de langue à 2 lettres ISO de Sitepoint pour une référence simple.
  • badge: Un USVString contenant l'URL de l'image utilisée pour représenter la notification lorsqu'il n'y a pas assez d'espace pour afficher la notification elle-même.
  • body: Un DOMString représentant le corps du texte de la notification, qui est affiché sous le titre.
  • tag: Un DOMString représentant un tag d'identification pour la notification.
  • icon: Une USVString contenant l'URL d'une icône à afficher dans la notification.
  • image: Une USVString contenant l'URL d'une image à afficher dans la notification.
  • data: Données arbitraires que vous souhaitez associer à la notification. Elles peuvent être de n'importe quel type de données.
  • vibrate: Un modèle de vibration que le matériel de vibration de l'appareil émet avec la notification.
  • renotify: Un Boolean spécifiant si l'utilisateur doit être notifié après qu'une nouvelle notification remplace l'ancienne. La valeur par défaut est false, ce qui signifie qu'ils ne seront pas notifiés.
  • requireInteraction: Un Boolean indiquant qu'une notification doit rester active jusqu'à ce que l'utilisateur clique dessus ou la rejette, plutôt que de se fermer automatiquement. La valeur par défaut est false.
  • actions: Un tableau de NotificationAction représentant les actions disponibles pour l'utilisateur lorsque la notification est présentée. Ce sont des options parmi lesquelles l'utilisateur peut choisir pour agir sur l'action dans le contexte de la notification elle-même. Le nom de l'action est envoyé au gestionnaire de notifications du service worker pour lui faire savoir que l'action a été sélectionnée par l'utilisateur.
  • silent: Un Boolean spécifiant si la notification est silencieuse (aucun son ni vibration émis), quels que soient les paramètres de l'appareil. La valeur par défaut est false, ce qui signifie qu'il ne sera pas silencieux.

Exemple

Dans notre démo Emogotchi (voir le code source), nous exécutons une fonction spawnNotification() lorsque nous voulons déclencher une notification. La fonction reçoit des paramètres pour spécifier le corps, l'icône et le titre souhaités, puis elle crée l'objet options nécessaire et déclenche la notification à l'aide du constructeur Notification().

function spawnNotification(theBody, theIcon, theTitle) {
  const options = {
    body: theBody,
    icon: theIcon
  }
  const n = new Notification(theTitle, options)
}

Spécifications

Spécification Status Comment
Notifications API
La définition de 'Notification() constructor' dans cette spécification.
Standard évolutif Définition initiale.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung Internet
Notification() constructorChrome Support complet 22
Support complet 22
Support complet 5
Préfixée
Préfixée Nécessite l'utilisation d'un préfixe : webkit
Edge Support complet ≤18Firefox Support complet 22
Support complet 22
Support complet 4
Préfixée
Préfixée Nécessite l'utilisation d'un préfixe : moz
IE Aucun support NonOpera Support complet 25Safari Support complet 6WebView Android Aucun support NonChrome Android Support complet OuiFirefox Android Support complet 22
Support complet 22
Support complet 4
Préfixée
Préfixée Nécessite l'utilisation d'un préfixe : moz
Opera Android Support complet OuiSafari iOS Aucun support NonSamsung Internet Android Support complet Oui

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Cette fonctionnalité nécessite un préfixe particulier ou utilise un autre nom.
Cette fonctionnalité nécessite un préfixe particulier ou utilise un autre nom.

Notes Chrome

À partir de Chrome 49, les notifications ne fonctionnent pas en mode navigation privée.

Notes Internet Explorer

La version 38.14352 et celles supérieure de MS Edge prend en charge l'API Notification. Wikipédia - MS Edge
IE 11 et inférieur n'est pas pris en charge.

Voir également