application de chat en temps réel

Par hana005, il y a 11 ans

Javascript

Bonjour,
je suis désolé si je n'ai pas écrit dans le bon forum,mon problème est que j'ai réalisé un client web avec angularJS et PHP5 (backend) maintenent je veux ajouter une application de chat avec mon client web et un autre client mobile (que je vais le réaliser avec phonegap ou ionic) ceci est t'il possible??
j'ai pas compris doù je peux commencer,j'ai lu des articles sur firebase avec angularJS mais mais l'application que je vais créer doit être crée où dans la partie web ou mobile
merci pour votre aide

6 réponses

Maenhyr, il y a 11 ans

Bonjour,
Pour pouvoir avoir un chat ou un système de notifications push, il est important de comprendre que tu dois utiliser un serveur push. Pour se faire plusieurs choix : techno spécifiques (APNS, ...) ou tout simplement les websockets. Pour mon exemple je vais choisir les websockets.

L'application va comporter 2 serveurs (un serveur PHP qui gère l'API, stockage en BDD, .... et le serveur Push qui va propager les notifications du serveur vers les clients).
Pour cet exemple, j'utilise socket.io. Le serveur API sera toujours l'émetteur des notifications Push et les clients web et mobiles les receveurs.

Comment cela va se passer ?

  1. Le client fait un envoi de message à l'api (ex : POST /api/chat/ avec le contenu "Coucou ça va ?") via l'api Rest basique
  2. Le serveur API gère la requête, enregistre en base, ...
  3. Le serveur API envoie une requête au serveur Push en disant qu'il y a un nouveau message à propager
  4. le serveur Push propage le message
  5. Les clients connectés recoivent le message

Voici le code pour PHP, il est assez simple :

// initialisation du Client // il faut entrer l'adresse du serveur push $client = new Client(new Version1X('http://localhost:1337')); $client->initialize(); // envoi de la notification push au serveur push // 2 parametres // - le channel // - les données $client->emit('broadcastphp', ['foo' => 'bar']); $client->close();

Voici un exemple du serveur Push fonctionnel : https://github.com/Arato/push. Comme tu peux le voir il y a très peu de code. Le serveur se charge juste de broadcaster les informations à tous les clients.

// ecouteur sur le channel 'broadcastphp' socket.on('broadcastphp', function (response) { console.log('broadcastphp', JSON.stringify(response)); io.emit('broadcastsocketio', response); });

Et côté client ce n'est pas plus compliqué :

// ecouteur sur le channel 'broadcastsocketio' socket.on('broadcastsocketio', function (response) { console.log('broadcastsocketio', response); // ici on récupère ['foo' => 'bar'] });

https://github.com/Arato/client/blob/master/app/scripts/controllers/alerts.js

Tu fais la même chose pour tous les clients mobiles et le tour est joué !

PS : j'ai mis le nom des channels bien spécifiques pour que tu comprennes comment ça fonctionne. Il est possible de n'avoir qu'un nom de channel pour toute la chaîne.

hana005, il y a 11 ans

merci prbaron pour l'éxplication :D,une question s'il vous plaît,je travaille avec symfony2 pour l'API rest,est ce qu'il existe un bundle qui permet de réaliser les mêmes fonctionnalités de la librairie PHP https://github.com/Wisembly/elephant.io merci encore une fois

Maenhyr, il y a 11 ans

elephant ne va servir que pour la partir push. pour la partir Rest c'est Symfony qui fera le job.

hana005, il y a 11 ans

ok merci beaucoup prbaron :D

hana005, il y a 11 ans

merci prbaron pour le lien :D