L'essentiel de Node.js

Utiliser socket.io

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Pour la mise en place de WebSockets, vous utiliserez l'excellente librairie socket.io. Ainsi, voyez comment générer un dialogue entre votre serveur et une page web.
04:52

Transcription

Pour en finir avec les explications sur les web sockets, et là vous aurez vraiment le panel complet, on va parler de la librairie socket.io. Alors, c’est une librairie extrêmement utilisée, moi-même d’ailleurs je l’utilise sur pas mal de projets, parce qu’elle est simple à intégrer, et en plus de ça elle nous permet de faire pas mal de choses. Alors, moi je vais me baser sur le Get started qu’on a là, qui est l’écriture d’une application de chat. Alors, bien sûr ce sera fonctionnel à la fin. Et on va simplement nous, faire une explication complète, ensemble, on va pas suivre le tutoriel non plus. La première étape ce sera évidemment d’installer socket.io. Alors pour l’installer, vous utiliserez npm install comme on l'a déjà vu. Et là vous serez parti, ce sera bon. Il vous faudra aussi Express. Nous on l’a déjà installé, donc vous devriez déjà l’avoir. En fait, voilà comment ça se passe. On va enchaîner trois commandes. On va créer une variable app qui va avoir Express, et qui va le démarrer tout de suite. On va créer une variable http qui va avoir http, et qui va démarrer un serveur avec Express. Et enfin on va avoir io qui va avoir socket.io, et qui va le démarrer avec http. Vous voyez bien l’enchainement des trois ici. Extrêmement important, pourquoi ? Parce que démarrer app nous permet de câbler des slashs, par exemple des urls, et de faire des choses à l’intérieur. Donc là en l’occurrence, on va faire un sendfile sur res, qui va nous permettre de servir le fichier html directement au travers de notre serveur. En plus de ça, le serveur va aussi être un serveur io. Alors, on a besoin ensuite d’utiliser io. On va intercepter la connexion, donc, io.on, connexion ici. Et ici on va retourner le socket. Ce socket-là, c’est le socket de l’utilisateur. On va donc, avec ce socket, pouvoir travailler. Et surtout on va pouvoir faire un socket.on, et là chat message, et on va récupérer cette information-là, le message de l’utilisateur, et on va faire un emit derrière. Donc c’est un tout petit peu différent de ce qu’on a vu avant. Ça fonctionne avec des on et des emit. C’est la seule différence réelle que vous avez. À la fin, on fait un listen ici sur le port 3000 et on démarre le serveur. C’est tout ce qu’il y a à faire du côté du serveur. Vous voyez que là, c’est assez simple. Évidemment ici, vous pouvez envoyer tout un tas de choses pour réceptionner différents verbes, et donc avoir une logique différente en fonction des différents verbes. Maintenant ici sur le client. C’est vrai que c’est un petit peu plus épais. Ne vous inquiétez pas, il y a beaucoup de styles ici, que vous pourrez recopier si vous le souhaitez. Ensuite on a juste une ul avec des messages dedans. On a un form qui, ici, a un bouton send, et juste un input. C’est tout ce qu’on a à l’intérieur. Et ensuite on utilise jquery, la librairie, et regardez, on ajoute le script socket.io, socket.io.js, qui va être automatiquement servi par le serveur. C’est comme ça que ça va marcher. Quand vous avez une installation de socket.io, en fait il va servir le js, il n’y a pas de problème avec ça. Donc ça on va le mettre comme ça. Ensuite dans le script, on démarre un socket avec var socket = io. Donc là on a vraiment var socket = io. Et ensuite on a ici des interceptions. Le form submit va nous permettre de faire un emit chat message avec l’information qu’on a dans le champ. On vide le champ. On retourne false. Et enfin le socket.on nous permet de réceptionner un message qui provient du serveur vers le client, et nous permet de le mettre à l’intérieur des messages dans une li. Donc là on a vraiment une balise li qui est créée, le message qui est mis à l’intérieur, et qui est ajoutée à la div ici, enfin du moins à l’ul avec un id, message. Vous voyez que ce n’est pas compliqué dans le fonctionnement. Avec un peu de style sympa comme ça, ça nous permet de faire très rapidement une petite interface. Et maintenant on n’a plus qu’à tester. Alors, comment ça fonctionne ? C’est la même chose toujours. On lance le serveur. Sur notre client, regardez, on vient se connecter. Effectivement on voit bien ici qu’il se connecte directement à socket.io. Et là si je rentre un message et je que l’envoie, effectivement j’envoie bien des messages et je reçois bien les messages, et c’est exactement pareil que l’implémentation ws. Alors, là où c’est différent, c’est dans les verbes d’utilisation. Donc socket.on, io.on, io.emit ou socket.emit. Donc si vous faites un io.emit, vous envoyez à tout le monde. Si vous faites un socket.emit, vous n’envoyez que sur le socket qui vous a parlé. Possibilité de développer des interfaces incroyables avec cette technologie. Focalisez-vous au maximum sur les sockets. Vous voyez que socket.io c’est extrêmement simple à utiliser aussi. Ce sera toujours la même pour boot strapper un serveur. Vous démarrerez par ça, vous n’oublierez pas le listen en-dessous, et puis vous câblez toute votre logique ici. N’hésitez pas non plus à faire des requires, c'est-à-dire à sortir des bouts en fait et à venir les mettre ailleurs, et de pouvoir comme ça, avoir quelque chose d’un petit peu plus sympa au niveau de l’organisation des fichiers. C’est extrêmement simple à utiliser. Les sockets c’est vraiment l’avenir parce que ça vous permet très rapidement de mettre en place des interfaces très dynamiques, et qui sont quasiment live, parce que c’est de l’instantané pour tout le monde. Donc, vraiment génial quand on doit avoir de l’instantané sur des applications, notamment c’est ce qui se passe avec une interface de chat.

L'essentiel de Node.js

Exploitez les possibilités de Node.js et créez des applications côté serveur entièrement en JavaScript. Travaillez avec des requêtes web, gérez le protocole WebSocket, etc.

4h00 (44 vidéos)
Aucun commentaire n´est disponible actuellement
Logiciel :
Node.js Node.js 7.0
Spécial abonnés
Votre/vos formateur(s) :
Date de parution :26 déc. 2016
Durée :4h00 (44 vidéos)

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !