Commencer avec Pusher Utiliser les canaux de présence

Dans cette série, nous avons découvert Channels from Pusher, une plate-forme qui vous permet de donner à vos utilisateurs l'expérience transparente qu'ils recherchent en temps réel..

Les canaux de présence s'appuient sur la sécurité fournie par les canaux privés, mais ils ajoutent l'avantage de savoir quels utilisateurs sont abonnés et connectés à ce canal. La meilleure partie est la facilité d'implémentation et d'utilisation des canaux de présence. Et c'est encore plus facile si vous avez déjà configuré votre application pour utiliser des canaux privés. Vous apprendrez à utiliser les canaux de présence dans cet article.

Une application de chat encore meilleure

Notre application de discussion utilise actuellement un canal privé afin de faciliter la communication instantanée client / serveur. Il va donc être extrêmement facile de configurer notre application pour utiliser un canal de présence. Commençons par l'application du serveur.

Modification du serveur

Afin d'utiliser un canal privé, nous avons configuré un point de terminaison pour garantir l'authentification d'un utilisateur avec notre application. Ce noeud final exécute le CanauxContrôleurde authorizeUser () méthode, et il appelle la bibliothèque Pusher de socket_auth () méthode pour aider à authentifier l'utilisateur. Pour utiliser un canal de présence, nous devons changer authorizeUser () appeler la bibliothèque de Pusher presence_auth () méthode, comme ceci:

fonction publique authorizeUser (Request $ request) if (! Auth :: check ()) retourne une nouvelle réponse ('Forbidden', 403);  $ presenceData = ['name' => Auth :: user () -> name]; echo $ this-> pusher-> presence_auth ($ request-> input ('channel_name'), $ request-> input ('socket_id'), Auth :: user () -> id, $ presenceData); 

Mais le changement de nom de méthode n'est que la première modification; nous devons aussi fournir presence_auth () avec l'identifiant unique de l'utilisateur et toute information supplémentaire que nous souhaitons fournir sur l'utilisateur. Le code ci-dessus stocke ces données utilisateur supplémentaires dans la $ presenceData variable et le passe comme argument final à presence_auth ().

De plus, nous devons modifier le envoyer le message() méthode. Le premier changement est le nom de la chaîne. Comme pour tous nos autres noms, nous devons préfixer le nom du canal pour indiquer le type de canal que nous voulons utiliser: présence- dans ce cas, comme indiqué dans le code suivant.

$ this-> pusher-> trigger ('chat de présence', 'send-message', $ data);

Nous pouvons également modifier les données que nous envoyons avec l'événement. Au lieu de fournir le nom de l'utilisateur qui a déclenché l'événement, nous pouvons inclure l'ID de l'utilisateur..

$ data ['user'] = Auth :: user () -> id;

Étant donné que nous utiliserons un canal de présence, nous pouvons rechercher les noms d'utilisateur à partir du client. Ce petit changement réduira la taille des données transitant sur le réseau..

Changer le client

Les clients canal object contient tout ce dont nous avons besoin pour travailler avec le canal souscrit, et l'interrogation des données utilisateur ne fait pas exception. Notre canal l'objet a une propriété appelée membres que nous pouvons utiliser pour récupérer les informations d’un utilisateur spécifique. Nous allons utiliser cet objet dans le envoyer le message gestionnaire d'événement, comme ceci:

this.channel.bind ('send-message', (data) => let utilisateur = this.channel.members.get (data.user); this.messages.push (message: data.message, utilisateur: utilisateur .info.nom););

Ici, nous appelons this.channels.members.get () et transmettez l'identifiant de l'utilisateur (rappelez-vous, notre application serveur fournit maintenant l'identifiant au lieu du nom). Cette méthode retourne un objet avec un Info propriété, et cela Info objet contient toutes les informations supplémentaires fournies dans le $ presenceData variable dans le authorizeUser () méthode sur le serveur. Donc, dans le code ci-dessus, nous récupérons le nom de l'utilisateur avec utilisateur.info.nom.

Nous pouvons également modifier le déclencheur() méthode pour inclure les informations sur l'utilisateur qui a déclenché l'événement d'alarme du client. Pour récupérer les données de membre de l'utilisateur actuellement connecté, vous utilisez le moi propriété, comme indiqué dans le code suivant:

trigger (eventName, message) this.channel.trigger (eventName, message, user: this.channel.members.me); 

Dans ce code, nous ajoutons un utilisateur propriété sur le contenu de l'événement et définissez-le sur l'objet utilisateur de l'utilisateur connecté. Cela signifie que nous pouvons modifier le envoi-client-alarme gestionnaire d'événement pour inclure le nom de l'utilisateur avec le message d'alarme, comme ceci:

this.channel.bind ('client-send-alarm', (data) => alert ('$ data.user.info.name: $ data.message'));

Ici, nous utilisons data.user.info.name pour accéder au nom de l'utilisateur afin de voir quel utilisateur a envoyé l'alarme, comme indiqué ici:

Conclusion

L'utilisation de canaux de présence confère à votre application la sécurité accrue d'un canal anonyme, mais vous offre également la possibilité d'interroger les données utilisateur pour les utilisateurs abonnés au canal. Avec Channels from Pusher, il est incroyablement facile d’ajouter à vos applications une communication sécurisée, en temps réel et riche en fonctionnalités..