Passer au contenu principal
Les notifications push web ré-engagent les utilisateurs avec du contenu opportun — même lorsqu’ils ne naviguent pas activement sur votre site web. Elles prennent en charge du contenu riche incluant du texte, des images, des boutons d’action et des sons.
Web push notification examples across different browsers and devices
Pour que le push web fonctionne :
  • Site web HTTPS : Le push web ne fonctionne que sur des sites sécurisés avec un certificat SSL valide
  • Service worker : Vous devez pouvoir ajouter le service worker OneSignal à votre site web
  • Origine de domaine unique : Doit suivre la politique de même origine
  • Autorisation de l’utilisateur : Les utilisateurs doivent explicitement accorder l’autorisation de recevoir des notifications
  • Navigateurs pris en charge : Fonctionne sur la plupart des navigateurs modernes (Chrome, Firefox, Safari, Edge)
Les utilisateurs ne peuvent pas s’abonner en mode Incognito ou navigation privée. Les appareils iOS nécessitent une configuration supplémentaire (voir Push web pour iOS). Certains navigateurs peuvent avoir des limites de notification ou nécessiter une interaction utilisateur — voir FAQ Push Web.
Ce guide parcourt chaque étape—de la configuration du SDK à l’envoi de messages push personnalisés—pour vous aider à implémenter avec succès les notifications push OneSignal.

Guides du développeur push web

Avant de pouvoir envoyer des notifications push web, votre développeur doit compléter les étapes suivantes.
Pas développeur ? Consultez Gérer les membres de l’équipe pour inviter un coéquipier avec accès développeur à votre projet OneSignal.

Options de configuration

Configurez votre site web pour le push web dans le tableau de bord OneSignal sous Paramètres > Push et intégrés > Web.
OneSignal dashboard showing web push platform activation in settings
Sélectionnez le type d’intégration qui correspond à votre site :
OneSignal dashboard showing integration type options: Typical Site, WordPress, and Custom Code
Détails du site :
  • Nom du site : Utilisé dans les titres de notification par défaut
  • URL du site : Doit correspondre exactement à l’origine de votre domaine (pas de chemins ni de discordance www)
  • Réabonnement automatique : Recommandé - Réabonne automatiquement les utilisateurs de retour qui ont effacé les données du navigateur
  • URL de l’icône par défaut : Image 256x256px affichée dans les notifications (si non définie, une icône de cloche par défaut est utilisée)

Réabonnement automatique

Si les utilisateurs effacent leurs données de navigateur, ils arrêteront de recevoir des notifications push. Activez cette option pour réabonner automatiquement les utilisateurs lorsqu’ils retournent sur votre site. Consultez Abonnements pour plus de détails.
OneSignal dashboard web push configuration settings showing site details and auto resubscribe option

Invites d’autorisation web

Inviter les utilisateurs à accorder l’autorisation de notification est essentiel pour l’opt-in. Vous pouvez personnaliser le comportement et l’apparence des demandes d’autorisation en fonction de votre configuration.
Utilisez une messagerie claire qui explique l’avantage, invitez les utilisateurs au bon moment (par ex. après l’engagement) et utilisez une pré-invite avant de déclencher la boîte de dialogue native du navigateur.

Notification de bienvenue

Vous pouvez activer un push de confirmation optionnel qui est envoyé immédiatement après qu’un utilisateur s’abonne. Les intégrations typiques et WordPress peuvent le définir dans le tableau de bord.
OneSignal dashboard showing welcome notification configuration with title, message, and URL fields
L’intégration de code personnalisé utilise l’objet welcomeNotification dans la fonction OneSignal.init. Consultez Référence du SDK Web pour plus de détails. Pourquoi envoyer des notifications de bienvenue ?
  • Informer les utilisateurs qu’ils se sont abonnés avec succès
  • Montrer à quoi ressembleront les futures notifications
  • Fournir du contenu d’intégration ou les prochaines étapes

Utilisateurs et abonnements

Lorsqu’un utilisateur s’abonne aux push, OneSignal crée automatiquement un abonnement unique lié à son navigateur/appareil. Les abonnements push web sont créés lorsque les utilisateurs :
  • Accordent l’autorisation pour les notifications push sur votre site web en utilisant un navigateur et un appareil spécifiques
  • Retournent sur votre site après avoir effacé les données du navigateur (si le réabonnement automatique est activé)
  • S’abonnent depuis un nouveau navigateur ou appareil
Chaque combinaison navigateur/appareil crée un abonnement séparé. Le mode incognito/navigation privée ne peut pas créer d’abonnements. Les abonnements push web restent anonymes jusqu’à ce que vous leur attribuiez un ID externe.
OneSignal dashboard Users page showing a list of Users with Subscription details

Support iOS

Apple a ajouté le support du push web pour les iPhones et iPads exécutant iOS 16.4+ mais avec des exigences plus strictes :
  • Les utilisateurs doivent ajouter votre site à leur écran d’accueil
  • Les invites d’autorisation sont affichées uniquement après cette étape
  • Les notifications se comportent comme des alertes d’application native une fois activées

Concevoir les notifications push web

Créer des notifications push efficaces implique plus qu’écrire du texte. Apprenez quels éléments sont personnalisables et comment les utiliser efficacement.
Annotated diagram showing the anatomy of a web push notification with customizable and browser-controlled elements
  1. Titre : Titre accrocheur (recommandé : moins de 50 caractères)
  2. Message : Contenu principal de la notification (recommandé : moins de 120 caractères)
  3. Icône : Icône de votre marque ou image spécifique à la notification (recommandé : 256x256px PNG ou JPG)
  4. Grande image : Contenu visuel accrocheur
  5. Boutons d’action : Boutons d’appel à l’action
  6. Navigateur : Le navigateur/l’application affichant le push
  7. Domaine : L’origine de votre site définie automatiquement par le navigateur
  8. Horodatage et fermeture : Le navigateur ajoute ces contrôles
  9. Plus d’options : Contrôles supplémentaires spécifiques au navigateur

Personnalisation et localisation des messages

Vous pouvez personnaliser les messages push pour correspondre aux préférences et à la langue de chaque utilisateur.

Configurer le comportement du push web

Contrôlez comment vos messages push se comportent après l’envoi—quand ils apparaissent, combien de temps ils sont stockés, et comment les utilisateurs interagissent.

Paramètres de livraison, d’affichage et de fermeture

Comportement de clic

Contrôlez ce qui se passe lorsqu’un utilisateur clique sur une notification. Par défaut : Le clic ouvre votre page d’accueil. Personnalisez-le :
  • Dirigez les utilisateurs vers une URL spécifique
  • Utilisez le suivi UTM
  • Supprimez le comportement par défaut avec ?_osp=do_not_open

Tester votre configuration

Avant le lancement, testez minutieusement votre implémentation de push web sur différents appareils et navigateurs.

Liste de vérification pré-lancement

  • Le SDK est correctement chargé sans erreurs
  • L’invite d’autorisation apparaît et fonctionne
  • La notification de test est envoyée et reçue
  • Les icônes et images s’affichent correctement
  • Le service worker est enregistré et à jour
  • Le certificat HTTPS est valide

Analyses push et dépannage

Mesurez les performances des notifications et résolvez les problèmes de livraison courants :

Prochaines étapes


Questions fréquentes

Les utilisateurs peuvent-ils s’abonner au push web sur iOS ?

Oui, à partir d’iOS 16.4+. Les utilisateurs doivent d’abord ajouter votre site web à leur écran d’accueil, puis accorder l’autorisation de notification. Consultez Push web pour iOS pour les étapes complètes de configuration.

Pourquoi un utilisateur a-t-il cessé de recevoir des notifications push web ?

La cause la plus courante est que l’utilisateur a effacé ses données de navigateur, ce qui supprime l’abonnement push. Activez Réabonnement automatique dans vos paramètres de push web pour réabonner automatiquement les utilisateurs de retour. Consultez Abonnements pour plus de détails.

Les notifications push web fonctionnent-elles en mode Incognito ou navigation privée ?

Non. Les utilisateurs ne peuvent pas s’abonner au push web en mode Incognito ou navigation privée. Les abonnements créés dans une session normale ne sont pas accessibles en mode privé.

Quels navigateurs prennent en charge les notifications push web ?

Chrome, Firefox, Safari (macOS et iOS 16.4+) et Edge prennent tous en charge le push web. Chaque navigateur peut avoir un comportement d’invite et un affichage de notification différents. Consultez FAQ Push Web pour les détails spécifiques à chaque navigateur.

Pourquoi mon invite de push web ne s’affiche-t-elle pas ?

Les causes courantes incluent : le site n’est pas servi via HTTPS, le service worker n’est pas enregistré correctement, l’utilisateur a déjà accordé ou refusé l’autorisation, ou l’utilisateur est en mode Incognito. Vérifiez la console du navigateur pour les erreurs et consultez Notifications non affichées pour une liste de vérification complète.