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 estauto
, qui adopte simplement le comportement du paramètre de langue du navigateur, mais vous pouvez remplacer ce comportement en définissant les valeurs deltr
etrtl
(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'unDOMString
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
: UnUSVString
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
: UnDOMString
représentant le corps du texte de la notification, qui est affiché sous le titre.tag
: UnDOMString
représentant un tag d'identification pour la notification.icon
: UneUSVString
contenant l'URL d'une icône à afficher dans la notification.image
: UneUSVString
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
: UnBoolean
spécifiant si l'utilisateur doit être notifié après qu'une nouvelle notification remplace l'ancienne. La valeur par défaut estfalse
, ce qui signifie qu'ils ne seront pas notifiés.requireInteraction
: UnBoolean
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 estfalse
.actions
: Un tableau deNotificationAction
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
: UnBoolean
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 estfalse
, 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(body, icon, title) {
const options = {
body: body,
icon: icon,
};
const n = new Notification(title, options);
}
Spécifications
Specification |
---|
Notifications API Standard # dom-notification-notification |
Compatibilité des navigateurs
BCD tables only load in the browser
Notes Chrome
À partir de Chrome 49, les notifications ne fonctionnent pas en mode navigation privée.
Chrome pour Android lance une erreur TypeError
lors de l'appel du constructeur Notification
. Il ne prend en charge que la création de notifications à partir d'un service worker. Consultez le Chromium issue tracker pour plus de détails.
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.