Movatterモバイル変換


[0]ホーム

URL:


  1. Web
  2. Les API Web
  3. Notification

Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in EnglishAlways switch to English

Notification

Limited availability

Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.

Note : Cette fonctionnalité est disponible via lesWeb Workers.

Contexte sécurisé: Cette fonctionnalité est uniquement disponible dans descontextes sécurisés (HTTPS), pour certainsnavigateurs qui la prennent en charge.

L'interface Notification de l'API Notifications est utilisée pour configurer et afficher les notifications de bureau à l'utilisateur. L'apparence et les fonctionnalités spécifiques de ces notifications varient selon les plates-formes, mais elles permettent généralement de fournir des informations de manière asynchrone à l'utilisateur.

Constructeur

Notification()

Créer une nouvelle instance de l'objectNotification.

Propriétés

Propriétés statiques

Ces propriétés ne sont disponibles que sur l'objetNotificationlui-même.

Notification.permissionLecture seule

Une chaîne représentant l'autorisation actuelle d'afficher les notifications. Les valeurs possibles sont:

  • denied — L'utilisateur refuse d'afficher des notifications.
  • granted — L'utilisateur accepte d'afficher des notifications.
  • default — Le choix de l'utilisateur est inconnu et donc le navigateur agira comme si la valeur était refusée.
Notification.maxActionsLecture seule

Le nombre maximal d'actions pris en charge par l'appareil et l'agent utilisateur.

Propriétés de l'instance

Ces propriétés ne sont disponibles que sur les instances de l'objetNotification.

Notification.actionsLecture seule

Tableau d'actions de la notification comme spécifié dans le paramètreoptions du constructeur.

Notification.badgeLecture seule

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.

Notification.bodyLecture seule

Une chaîne représentant le corps de la notification telle que spécifiée dans le paramètreoptions du constructeur.

Notification.dataLecture seule

Renvoie un clone structuré des données de la notification.

Notification.dirLecture seule

La direction du texte de la notification comme spécifié dans le paramètreoptions du constructeur.

Notification.langLecture seule

Code de langue de la notification tel que spécifié dans le paramètreoptions du constructeur.

Notification.tagLecture seule

L'ID de la notification (le cas échéant) tel que spécifié dans le paramètreoptions du constructeur.

Notification.iconLecture seule

L'URL de l'image utilisée comme icône de la notification comme spécifié dans le paramètreoptions du constructeur.

Notification.imageLecture seule

L'URL d'une image à afficher dans le cadre de la notification, comme spécifié dans le paramètreoptions du constructeur.

Notification.renotifyLecture seule

Spécifie si l'utilisateur doit être averti après qu'une nouvelle notification remplace l'ancienne.

Notification.requireInteractionLecture seule

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.

Notification.silentLecture seule

Spécifie si la notification doit être silencieuse, c'est-à-dire qu'aucun son ou vibration ne doit être émis, quels que soient les paramètres de l'appareil.

Notification.timestampLecture seule

Spécifie l'heure à laquelle une notification est créée ou applicable (passée, présente ou future).

Notification.titleLecture seule

Le titre de la notification tel que spécifié dans le premier paramètre du constructeur.

Notification.vibrateLecture seule

Spécifie un modèle de vibration pour les périphériques dotés d'un matériel de vibration à émettre.

Gestionnaires d'événements

Notification.onclick

Un gestionnaire pour l'événementclick. Il est déclenché à chaque fois que l'utilisateur clique sur la notification.

Notification.onclose

Un gestionnaire pour l'événementclose. Il est déclenché lorsque l'utilisateur ferme la notification.

Notification.onerror

Un gestionnaire pour l'événementerror. Il est déclenché chaque fois que la notification rencontre une erreur.

Notification.onshow

Un gestionnaire pour l'événementshow. Il est déclenché lorsque la notification est affichée.

Méthodes

Méthodes statiques

Ces méthodes ne sont disponibles que sur l'objetNotificationlui-même.

Notification.requestPermission()

Demande l'autorisation à l'utilisateur d'afficher les notifications.

Méthodes d'instance

Ces propriétés ne sont disponibles que sur une instance de l'objetNotificationou via sonprototype. L'objetNotificationhérite également de l'interfaceEventTarget.

Notification.close()

Ferme programmatiquement une instance de notification.

Exemples

Supposons ce HTML de base:

html
<button>Notifie moi !</button>

Il est possible d'envoyer une notification comme suit - nous présentons ici un ensemble de code assez détaillé et complet que vous pourriez utiliser si vous vouliez d'abord vérifier si les notifications sont prises en charge, puis vérifiez si l'autorisation a été accordée pour l'origine actuelle d'envoyer des notifications, puis demander l'autorisation si nécessaire, avant d'envoyer une notification.

js
function notifyMe() {  // Vérifions si le navigateur prend en charge les notifications  if (!("Notification" in window)) {    alert("Ce navigateur ne prend pas en charge la notification de bureau");  }  // Vérifions si les autorisations de notification ont déjà été accordées  else if (Notification.permission === "granted") {    // Si tout va bien, créons une notification    const notification = new Notification("Salut toi!");  }  // Sinon, nous devons demander la permission à l'utilisateur  else if (Notification.permission !== "denied") {    Notification.requestPermission().then((permission) => {      // Si l'utilisateur accepte, créons une notification      if (permission === "granted") {        const notification = new Notification("Salut toi!");      }    });  }  // Enfin, si l'utilisateur a refusé les notifications, et que vous  // voulez être respectueux, il n'est plus nécessaire de les déranger.}

Nous ne montrons plus d'exemple en direct sur cette page, car Chrome et Firefox n'autorisent plus les demandes de notification des<iframe>s d'origine croisée, avec d'autres navigateurs à suivre. Pour voir un exemple en action, consultez notreexemple de liste de tâches (voir également l'application en cours d'exécution.)

Note :Dans l'exemple ci-dessus, nous générons des notifications en réponse à un geste de l'utilisateur (en cliquant sur un bouton). Il ne s'agit pas seulement d'une bonne pratique - vous ne devriez pas envoyer de spam aux utilisateurs avec des notifications qu'ils n'acceptent pas - mais les navigateurs suivants interdiront explicitement les notifications non déclenchées en réponse à un geste de l'utilisateur. Firefox le fait déjà depuis la version 72, par exemple.

Spécifications

Specification
Notifications API
# api

Compatibilité des navigateurs

Voir aussi

Help improve MDN

Learn how to contribute

Cette page a été modifiée le par lescontributeurs du MDN.


[8]ページ先頭

©2009-2025 Movatter.jp