Comment envoyer des notifications push depuis WordPress vers les navigateurs et les téléphones

Un membre de votre site reçoit un nouveau message, mais il a fermé l’onglet de votre site il y a une heure. Un e-mail lui parviendra peut-être plus tard, quelque part au milieu des newsletters. Une notification push, elle, s’affiche sur son ordinateur ou son téléphone en quelques secondes, même quand le site est fermé, et un clic ouvre la conversation.

Les navigateurs le permettent depuis des années, et un site WordPress peut lui aussi s’en servir. Cet article explique comment fonctionne le web push, ce qui le rend plus difficile qu’il n’y paraît sur WordPress, que faire pour les iPhone, et comment WordPlus Cloud envoie les notifications push d’un site WordPress.

Comment fonctionne le web push

Le web push repose sur trois éléments : le navigateur, le service push de l’entreprise qui le développe, et votre site.

• Une autorisation, une seule fois. Le navigateur demande au membre si votre site peut afficher des notifications. Ce choix vaut pour le site, et le membre peut le modifier à tout moment dans son navigateur.
• Un service worker. C’est un petit script que le navigateur garde pour votre site et qu’il lance de lui-même quand une notification push arrive, si bien qu’elle s’affiche même quand aucune page du site n’est ouverte.
• Un abonnement. Le navigateur s’inscrit auprès de son service push (celui de Google pour Chrome, celui de Mozilla pour Firefox, celui d’Apple pour Safari, et ainsi de suite) et remet à votre site une adresse et des clés propres à ce seul navigateur. Un membre qui a un ordinateur portable et un téléphone a donc deux abonnements.
• L’envoi. Votre site chiffre la notification avec les clés de ce navigateur, signe la requête avec sa propre paire de clés et l’envoie à cette adresse. Le service push la livre dès que l’appareil est en ligne. Aucun compte auprès d’un service push n’est nécessaire.

Pourquoi c’est plus difficile qu’il n’y paraît sur WordPress

Le côté navigateur est la partie facile. C’est l’envoi qui met un site WordPress en difficulté.

• Chaque notification est chiffrée pour un seul navigateur. Un message envoyé à un groupe de 50 membres, chacun avec un téléphone et un ordinateur, représente 100 chiffrements distincts et 100 requêtes vers les services push. En PHP sur un hébergement mutualisé, cela prend plusieurs secondes, soit dans la requête du membre qui a envoyé le message, et qui doit attendre, soit en arrière-plan.
• Le travail en arrière-plan attend les visiteurs. WordPress exécute ses tâches planifiées, WP-Cron, quand quelqu’un ouvre une page. Par une soirée calme, une file de notifications peut attendre plusieurs minutes le prochain visiteur, et la notification arrive une fois le moment passé.
• WordPress ne sait pas qui regarde. Une notification doit atteindre les membres absents, et non s’afficher par-dessus la conversation que quelqu’un est en train de lire. WordPress ne voit que des requêtes, il ne peut donc pas savoir qui a le site ouvert dans un onglet. Pour le savoir, il faut une connexion qui reste ouverte, ce qu’un hébergeur WordPress ne peut pas maintenir, comme nous l’avons expliqué dans pourquoi WordPress ne peut pas garder un websocket ouvert.
• Un seul service worker par site. Un navigateur ne garde qu’un worker par adresse. Deux extensions qui installent chacune le leur se remplacent l’une l’autre, et les notifications de l’une d’elles cessent d’arriver, sans la moindre erreur.
• Les abonnements deviennent obsolètes. Les membres vident leur navigateur, changent d’appareil ou désactivent les notifications. Le service push refuse alors cette adresse, et un site qui ne la retire pas continue d’envoyer dans le vide.

Les services push hébergés se chargent de l’envoi, mais en général avec leur propre script sur vos pages, leur propre worker, et la liste des appareils de vos membres chez eux, et non sur votre site.

iPhone et iPad

Sur iPhone et iPad, Safari n’affiche les notifications web push que pour un site ajouté à l’écran d’accueil, à partir d’iOS 16.4. Dans un onglet Safari ordinaire, il n’y a aucune notification push, et rares sont les membres qui ajoutent un jour un site à leur écran d’accueil.

Sur iPhone, la solution fiable est donc une application. Une application native reçoit ses notifications par le service d’Apple, et sur Android par celui de Google, et un appel entrant peut sonner comme un appel téléphonique, même sur un écran verrouillé. C’est pourquoi un site dont beaucoup de membres sont sur téléphone veut en général les deux : le web push pour les ordinateurs et les navigateurs Android, et une application pour tous les autres.

Comment WordPlus Cloud envoie les notifications push pour WordPress

WordPlus Cloud for WordPress envoie les notifications push des extensions de votre site, pour que votre hébergement n’ait jamais à le faire. Better Messages l’utilise d’emblée, pour les nouveaux messages et les appels entrants :

• Votre site n’envoie jamais lui-même de notification push. Quand un membre envoie un message, Better Messages le transmet à nos serveurs temps réel, avec les abonnements des membres qui pourraient avoir besoin d’une notification. Les serveurs chiffrent et envoient chaque notification, si bien que votre hébergement ne fait qu’une courte requête, comme pour n’importe quel message, quelle que soit la taille du groupe.
• Seulement aux membres absents. Ces mêmes serveurs livrent le message à chaque page où la conversation est ouverte, ils savent donc qui est sur le site en ce moment. Une notification ne part que vers les membres qui n’y sont pas, ou, si vous le choisissez, aussi vers ceux qui n’ont pas lu le message 5 secondes plus tard.
• Rien de la conversation sur un écran verrouillé. Une notification de message indique son expéditeur, avec sa photo, et ouvre la conversation d’un clic. Le message lui-même reste sur votre site, si bien que rien de son contenu n’attend sur un téléphone verrouillé ni ne passe par les services push.
• Une notification par conversation. Une nouvelle notification de la même conversation remplace la précédente, si bien que cinq messages à la suite donnent une seule notification, et non cinq.
• Une seule demande, pour tout le site. WordPress sert un seul service worker et garde un seul abonnement par navigateur, partagé par toutes les extensions WordPlus du site, si bien qu’un membre n’autorise les notifications qu’une fois. Les abonnements qu’un service push refuse sont retirés d’eux-mêmes.
• Tous les navigateurs qui prennent en charge le web push. Chrome, Edge, Firefox et Opera sur ordinateur et sur Android, Safari sur Mac, et Safari sur iPhone ou iPad pour un site ajouté à l’écran d’accueil. Les membres qui n’autorisent rien de tout cela reçoivent toujours les notifications par e-mail.

Pour l’activer, il suffit d’un réglage dans Better Messages, comme le montre sa documentation sur le web push. Le navigateur demande ensuite l’autorisation à chaque membre à un moment qui a du sens, la première fois qu’il ouvre une conversation, et non dès le chargement d’une page.

Votre propre application pour iPhone et Android

Pour les membres sur téléphone, Better Messages construit vos propres applications iOS et Android, avec le nom et l’icône de votre site, prêtes à publier sur l’App Store et Google Play. Leurs notifications passent par Apple et Google, les appels entrants sonnent comme des appels téléphoniques, et les membres se connectent avec leur compte sur votre site. La création des applications, les appels et les notifications tournent sur WordPlus Cloud et sont inclus dans l’abonnement. Publier une application demande vos propres comptes développeur chez Apple et Google, et la documentation de l’application iOS détaille chaque étape.

Des notifications push sans serveur à vous

Les notifications push sont incluses dans chaque abonnement WordPlus Cloud for WordPress, aux côtés des mises à jour en direct, des appels, de la diffusion en direct et de l’IA, avec un prix par site. Votre hébergement continue de répondre aux requêtes, et vos membres apprennent l’arrivée d’un nouveau message où qu’ils soient.

Découvrez WordPlus Cloud for WordPress, ou consultez les tarifs pour votre nombre de sites.