Comment Envoyer des Notifications Push Web Avec PHP

L’API Push Web vous permet d’envoyer des notifications push aux navigateurs Web et aux API. Bien que la majeure partie de la logique se passe dans le navigateur, vous avez toujours besoin d’un composant côté serveur pour générer vos notifications. Voici comment implémenter un backend Web Push en utilisant PHP.

Prérequis

Pour les besoins de ce tutoriel, nous supposerons que vous connaissez les bases de la création d’API HTTP en PHP. Vous devrez exposer quelques points de terminaison publics à l’aide de votre framework Web. Ceux-ci seront appelés par le JavaScript de votre navigateur pour enregistrer et désenregistrer les appareils.

Cet article ne touchera pas au code côté navigateur ni à son fonctionnement. Vous devrez créer un agent de service qui répond aux événements push entrants et affiche une notification à l’utilisateur.

À un niveau élevé, le flux de poussée Web ressemble à ceci:

1. Un abonnement push est enregistré dans le navigateur. Le navigateur émet une URL de point de terminaison unique pour votre JavaScript.
2. Votre JavaScript envoie les données d’abonnement à votre serveur et identifie l’utilisateur auquel il s’adresse.
3. Lorsque votre backend doit envoyer une notification push, créez une charge utile et envoyez-la à l’URL du point de terminaison signalée dans le cadre des données d’abonnement.
4. Le navigateur de l’utilisateur recevra la charge utile via la plate-forme de notification du fournisseur. Votre agent de service JavaScript gère l’événement qui en résulte et utilise l’API de notification du navigateur pour alerter l’utilisateur.

Voici comment implémenter les aspects côté serveur des étapes 1 à 3.

Obtenir la configuration

Nous utiliserons le package Packagist web-push par minishlink. Cela résume les interactions avec chaque plate-forme de notification de navigateur afin que vous n’ayez pas à distinguer manuellement les types de points de terminaison.

Ajoutez le package à votre projet en utilisant Composer:

composer require minishlink/web-push

Pour utiliser la dernière version, vous avez besoin de PHP 7.2 ou supérieur avec le gmp, mbstring, curl, et openssl extensions. Si vous devez utiliser une version PHP plus ancienne, verrouillez le paquet sur une version antérieure pour maintenir la compatibilité.

La bibliothèque expose une classe core WebPush avec des méthodes qui vous permettent d’envoyer des notifications individuellement ou par lots. Les abonnements sont représentés par des instances de la classe Subscription.

Fourniture de clés VAPID

La confiance dans l’écosystème Web Push conforme aux normes est renforcée grâce à l’utilisation de clés VAPID. Votre serveur a besoin d’une paire de clés VAPID pour pouvoir s’authentifier auprès des navigateurs. La clé publique doit être exposée via un point de terminaison API.

Vous pouvez générer un jeu de clés VAPID à l’aide du package web-push:

use Minishlink\WebPush\VAPID; $keyset = VAPID::createVapidKeys(); // public key - this needs to be accessible via an API endpointecho $keyset; // private key - never expose this!echo $keyset; file_put_contents("vapid.json", json_encode($keyset));

Générez des clés pour votre système et stockez-les dans un emplacement persistant. Ajoutez un point de terminaison API pour que votre JavaScript côté client puisse récupérer la clé publique. Cela sera utilisé pour configurer l’abonnement push du navigateur. L’appareil de l’utilisateur acceptera les événements push entrants s’ils ont été signés à l’aide de la clé privée VAPID correspondante.

Enregistrement des abonnements Push

L’étape suivante de la séquence consiste à recevoir les demandes d’abonnement push de vos clients. Une fois que le navigateur a confirmé un nouvel abonnement push, votre JavaScript doit envoyer l’URL du point de terminaison de l’abonnement et les clés d’authentification associées à votre serveur. Stockez ces informations à côté de l’identifiant de l’utilisateur afin que vous puissiez récupérer tous les appareils inscrits par push liés à l’utilisateur ultérieurement.

Nous omettons des échantillons de code pour cette étape car l’implémentation dépend de votre couche de stockage de données et des valeurs envoyées par votre JavaScript. Typiquement, ce sera une représentation JSON d’un objet PushSubscription. Vous avez besoin d’un ensemble simple de points de terminaison d’API CRUD sauvegardés dans une base de données pour créer un abonnement, en remplacer un existant et demander une suppression lorsque l’utilisateur se désinscrit.

Préparation des abonnements

Une fois qu’un client est enregistré avec succès, vous pouvez commencer à envoyer des notifications à l’aide de la bibliothèque web-push. Commencez par créer une instance de la classe WebPush:

use Minishlink\WebPush\WebPush; $webPush = new WebPush(]);

Vous pouvez réutiliser une instance WebPush chaque fois que vous envoyez une notification. La bibliothèque doit être configurée avec le jeu de clés VAPID que vous avez généré précédemment. Les clés doivent être encodées en Base64 mais cela est géré pour vous si vous les créez avec la bibliothèque.

Le VAPID subject est utilisé pour identifier votre serveur et ses coordonnées. Vous pouvez fournir une URL de site Web ou un lien d’adresse e-mail mailto:.

Ensuite, vous devez récupérer l’abonnement push auquel vous allez envoyer. Utilisez votre système d’accès aux données pour rechercher les URL de point de terminaison push associées à l’utilisateur auquel vous souhaitez envoyer. Convertir chaque abonnement en une instance Subscription:

use Minishlink\WebPush\Subscription; // Get user's push data...// SELECT * FROM push_subscriptions WHERE user_id = 123456 $subscription = Subscription::create(]);

La propriété auth de la PushSubscription est répétée deux fois pour faire face à deux versions différentes de la spécification utilisée par les services de navigateur. La propriété P256DH est une autre clé publique qui doit être fournie lorsqu’elle est définie sur l’abonnement.

La bibliothèque web-push est compatible avec les terminaux push Chrome et Firefox. Il fonctionnera également avec toute autre implémentation de Push Web conforme à la norme actuelle.

Envoi d’une notification

Combinez maintenant vos instances WebPush et Subscription pour envoyer une notification:

$result = $webPush -> sendOneNotification( $subscription, json_encode());

Appeler sendOneNotification() fournit une livraison immédiate pour une seule notification. La charge utile dans ce cas est un tableau codé JSON avec deux propriétés. C’est à vous de décider des données que vous envoyez et du format que vous utilisez – votre client JavaScript les reçoit telles quelles et peut les interpréter si nécessaire.

L’envoi d’une notification renvoie une classe de résultat qui vous permet de vérifier si l’opération a réussi:

if ($result -> isSuccess()) { // all good}else { // something went wrong error_log($result -> getReason()); // provides raw HTTP response data error_log($result -> getResponse()); }

Vous pouvez prendre des mesures pour réessayer ou annuler la livraison en cas d’erreur.

Les abonnements aux notifications peuvent également expirer. Appelez la méthode isSubscriptionExpired() sur une classe de résultats pour déterminer si c’est la raison de l’échec. Vous pouvez supprimer l’abonnement de votre base de données dans ce scénario, en vous assurant de ne rien envoyer d’autre à un point mort.

Notifications de lot

Les notifications peuvent être groupées ensemble pour une livraison avec un appel de méthode:

$webPush -> queueNotification($subscription, );$webPush -> queueNotification($subscription, ); foreach ($webPush -> flush() as $i => $result) { echo ("Notification $i was " . ($result -> isSuccess() ? "sent" : "not sent"));}

Ceci est utile lorsque vous savez que vous allez envoyer un grand nombre de notifications dans un court laps de temps. Mettez en file d’attente toutes vos charges utiles et laissez web-push les livrer de la manière optimale.

Vous pouvez limiter le nombre de notifications envoyées en un seul flush() en passant un entier à la méthode:

$webPush -> flush(100); // send 100 messages

La valeur par défaut est 1000.

Options de notification

sendOneNotification() et queueNotification() acceptent les options suivantes comme troisième argument de tableau:

• TTL – Contrôle la durée pendant laquelle la plate-forme de notification du navigateur conservera la notification si elle ne peut pas être transmise immédiatement à l’appareil de l’utilisateur. Si l’appareil de l’utilisateur est hors ligne, les plates-formes essaient par défaut de le livrer pendant les quatre prochaines semaines. Si vous envoyez une notification qui ne sera pas pertinente la semaine prochaine, ajustez le TTL en conséquence afin que l’utilisateur ne voie pas de contenu obsolète.
• urgency – Accepte normal, low ou very-low comme valeurs. Certaines plateformes peuvent l’utiliser pour ajuster la fréquence de livraison des notifications. Les appareils qui passent en mode d’économie de batterie peuvent suspendre l’envoi de notifications non urgentes.
• batchSize – Cela a le même effet que l’argument de flush() décrit ci-dessus.

Vous pouvez configurer les valeurs d’option par défaut à l’aide du deuxième argument du constructeur WebPush:

$webPush = new WebPush(], );

Résumé

La bibliothèque web-push facilite l’envoi de notifications Push Web en utilisant PHP. Vous obtenez une couche d’abstraction au sommet des différentes plates-formes de navigateur qui prend en charge le traitement par lots, la gestion des erreurs et toutes les fonctionnalités de Push Web.

Le mécanisme de poussée Web est un système de navigateur inhabituel car il dépend des composants côté serveur distants que vous fournissez vous-même. Cela peut le rendre opaque et technique. En pratique, la création d’un backend PHP simple est rapide et facile ; l’implémentation frontend est généralement l’aspect le plus chronophage, en particulier si vous n’utilisez pas déjà les fonctionnalités de service worker.