SlideShare une entreprise Scribd logo
Le protocole
WAMP.ws
Avec
Autobahn + Crossbar.io
WAMPprotocol
(Web Application Messaging Protocol)
≠
WAMP server stack
(Windows, Apache, MySQL, PHP)
WAMP.ws
est un protocole créé pour tirer parti des
websockets
(http://wamp.ws/)
Il permet de faire communiquer en temps réel
des technologies différentes ainsi que des
processus et machines différentes.
WAMP.ws offre deux outils
RPC
PUB/SUB
Depuis et vers :
● JS (Node et Navigateur)
● Python (pur)
● C++
● Java
● Objective-C
● PHP
● C#
&
RPC : Remote Procedure Call
● Permet d'appeler une fonction d'un autre code à
distance à travers une websocket.
● Asynchrone, performant, propre, léger. Mais simple.
● Paramètres et valeurs de retour peuvent être :
arrays, maps, nombres et chaînes.
● Marche entre deux langages différents.
● Marche entre processus locaux ou à travers
internet.
RPC – Exemple 1
Tout ce qu'on fait d'habitude avec AJAX
Navigateur
Comme un GET /user/profile, mais plus rapide puisque via Websocket.
Serveur
getUserProfile()
{'user' : 'sam', 'id' : 1}
RPC
RPC – Exemple 2
Communication entre navigateurs
Navigateur
de Sam
Si on code un jeu d'échecs et que je bouge un pion, mon navigateur peut dire
directement à celui de Max de bouger le pion sur son écran.
moveQueen('A', '5')
RPC
Navigateur
de Max
RPC – Exemple 3
Push de données vers le navigateur
Si on code un jeu d'échecs avec une intelligence artificielle et que c'est au tour du bot,
il peut directement dire au navigateur du joueur humain de bouger le pion sur son écran.
moveQueen('A', '5')
RPC
NavigateurServeur
RPC – Exemple 4
Microservices
Plutôt que d'avoir une grosse application centrale qui fait tout, on peut avoir plusieurs processus
séparés qui font chacun une tâche. Avantage : on peut les réutiliser, les partager entre
projets, les redémarrer indépendamment, les répartir sur plusieurs serveurs...
moveQueen('A', '5')
RPC
Navigateur
Auth IA ChatCompétition
SendMsg('yolo')getPool()login()
RPC – Exemple 5
Y a pas que le navigateur dans la vie
Différents services peuvent communiquer entre eux par le même biais. Même protocole, même
API, quels que soient les langages dans lesquels ils sont écrits. Qu'ils soient sur le même serveur
ou non. On peut ainsi déléguer des tâches sur d'autres services, ou machines.
RPC
Python
Rasberry Pi
NodeJSArduino
getVideo()
toggleLED()
Montrez-moi le code !
Voici un exemple simple d'un navigateur appelant
une fonction définie dans un autre navigateur.
Résultat voulu
Index.html
button.html
RPC
Callback
Réponse
index.html
<!DOCTYPE html><html> <head>
<script
src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn.
min.jgz"
type="text/javascript"></script>
</head><body>
<p id="baby">Appelez callMeMaybe() depuis un autre
navigateur :)</p>
</body><script>
// Connexion au serveur de test WAMP.
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// Lancer ce code une fois que la connexion est réussie.
connection.onopen = function (session) {
// On déclare que cette fonction est appelable
// par un autre client
session.register('callMeMaybe', function(message){
// On change le contenu de la page.
document.getElementById('baby').innerHTML = message
// On retourne la userAgent du navigateur comme ça vous pouvez
// tester sur 2 nav différents et voir qu'ils communiquent
return navigator.userAgent;
});
};
// Ouvrir la connexion.
connection.open();
</script></html>
button.html
<!DOCTYPE html><html> <head>
<script
src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn.
min.jgz"
type="text/javascript"></script>
</head><body>
<p><button onClick='callIt()'>Call It, bobby !</button></p>
</body><script>
// Connexion au serveur de test WAMP.
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// Lancer ce code une fois que la connexion est réussie.
connection.onopen = function(session) {
callIt = function(){
/* Appel de la fonction callMeMaybe() sur l'autre nav */
session.call("callMeMaybe", ['I called baby !'])
/* L'appel retourne une promesse */
.then(function(userAgent){
alert(userAgent);
});
return false;
}
};
// Ouvrir la connexion.
connection.open();
</script></html>
Comment ça marche ?
● Chaque code utilisant WAMP.ws est un client qui a
besoin d'une bibliothèque dédiée à cela.
● Il faut un serveur central, entre tous les clients.
Comme avec RabbitMQ pour AMQP. Ce n'est pas
du P2P à la WebRTC.
● Les libs et le serveur sont libres, à disposition, prêts
à l'usage.
● Il existe des moyens de sécurisation (permissions,
chiffrement). Ceci est une démo simple.
RPC – Sous le capot
Communication entre navigateurs
Navigateur
de Sam
Même si on ne le voit pas en codant, il y a un routeur qui transmet les messages.
Il faut ce routeur installé quelque part pour que WAMP fonctionne.
Navigateur
de Max
moveQueen('A', '5')
Routeur
RPC – Sous le capot
Communication entre navigateurs
AutoBahnJS
moveQueen('A', '5')
AutoBahnJSCrossbar.io
AutobahnX (AutobahnPython, AutobahnJS, AutobanCpp…) sont les noms des libs
les plus utilisées pour permettre à votre code, le client, de parler WAMP.
Crossbar.io est le nom du routeur le plus complet.
Pour vous
● Vous allez uniquement coder le client, avec une
des bibliothèques Autobahn.
● Pour vos tests vous pouvez utiliser le routeur
de démonstration (wss://demo.crossbar.io/ws).
Il n'y a rien à installer.
● En production, vous installez crossbar.io. Un
peu comme on installe Apache ou Nginx pour
faire du HTTP.
PUB/SUB
● Un client s'abonne (SUBscribe) à un sujet.
● Un autre client publie un message (PUBlish) sur ce
sujet.
● Tous les clients abonnés à ce sujet en particulier
reçoivent le message.
PUB/SUB
● Un client s'abonne (SUBscribe) à un sujet.
● Un autre client publie un message (PUBlish) sur ce
sujet.
● Tous les clients abonnés à ce sujet en particulier
reçoivent le message.
Même principe que RPC, mais permet d'envoyer un
messages à 0 ou N clients, pas juste 1. Néanmoins, il
n'y a pas de valeur de retour possible.
PUB/SUB – Exemple 1
Notifications
Navigateur
Le serveur vient de mettre à disposition une nouvelle vidéo. Tous les
navigateurs reçoivent immédiatement l'information et l'affichent sur la page.
Serveur
{'title: 'Chat rigolo', 'id' : 2}
SUB : abonnés au sujet « nouvelle vidéo »
Navigateur Navigateur
PUB
PUB/SUB – Exemple 2
Synchronisation
Web
Crawler
Tous vos composants sont toujours au courant de tout ce qu'ils
doivent savoir, où qu'ils soient. Ici, si l'admin change la valeur d'un
paramètre, il peut prévenir tous les processus concernés.
Serveur
d'encodage
Site Web
SUB : abonnés au sujet « changement
d'un paramètre »
Admin
{'settings': 'debug',
'oldValue' : false,
'newValue' : true}
Montrez-moi le code !
Même exemple que pour RPC, mais cette fois, on
peut ouvrir index.html dans plusieurs tabs à la
fois.
Résultat attendu
Index.html
button.html
PUB
Callback
(A SUB préalablement)
Si on ouvre 10 tabs avec
index.html, les 10 vont réagir.
Mais button.html ne peut
pas récupérer de valeur
en retour.
index.html
<!DOCTYPE html><html> <head>
<script
src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn.
min.jgz"
type="text/javascript"></script>
</head><body>
<p id="baby">J'attends des nouvelles de fascinatingSubject</p>
</body><script>
// Connexion au serveur de test WAMP.
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// Lancer ce code une fois que la connexion est réussie.
connection.onopen = function (session) {
// On déclare que cette fonction est appelée si il y a des
nouvelles
// à propos de ce sujet
session.subscribe('fascinatingSubject', function(message){
// On change le contenu de la page.
document.getElementById('baby').innerHTML = message
// Pas de valeur de retour, le PUB/SUB est à sens unique
});
};
// Ouvrir la connexion.
connection.open();
</script></html>
button.html
<!DOCTYPE html><html> <head>
<script
src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn.
min.jgz"
type="text/javascript"></script>
</head><body>
<p><button onClick='sayIt()'>Say It, bobby !</button></p>
</body><script>
// Connexion au serveur de test WAMP.
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// Lancer ce code une fois que la connexion est réussie.
connection.onopen = function(session) {
sayIt = function(){
/* Publication sur le sujet fascinatingSubject */
session.publish("fascinatingSubject", ['Amazing !']);
// Pas de retour de valeur puisqu'on ne sait pas quels
// clients vont recevoir le message
}
};
// Ouvrir la connexion.
connection.open();
</script></html>
La stack complète
Que faire de tout ça ?
● Des apps Web complètes. WAMP est un bon compagnon
de frameworks comme AngularJS et remplace AJAX ou les
websockets à la main pour une mise à jour en temps réel.
● Des grappes d'objets connectés (IoT, Rasberry PI,
Arduino…) : remplace MQTT.
● Des microservices : authentification, logging, encodage
video. Remplace AMQP et ZeroMQ.
● Des jeux vidéos.
● Des applications collaboratives (à la Google Doc).
● Des apps Androids ou iOS natives.
A propos de crossbar.io
● Crossbar est un routeur WAMP complet. Sans
routeur, les clients ne peuvent se parler.
● Il doit être accessible via websocket.
● Il peut gérer le cycle de vie des clients.
● Il peut aussi gérer le cycle de vie de processus non
WAMP : c'est un gestionnaire de processus complet
(comme supervisord) afin de faciliter les
architectures à base de plusieurs micro-services.
● Il intègre même un serveur Web si nécessaire.
Où est le piège ?
● Technologie encore jeune. WAMP V1 vient d'être
déprécié en faveur de WAMP 2.
● Des outils qui restent à créer : authentification
utilisateur, debugage avancé...
● Obligation d'être asynchrone : pour le moment
incompatible avec WSGI (et donc Django). Un
bridge est en projet.
● Une doc toujours en évolution (mais je viens d'être
embauché pour ça).
Does it blend ?
En stressant un peu sa stack WAMP, on peut :
● Envoyer 1,000 PubSub/sec de 32+ bytes vers 1,000 abonnés pour
une latence moyenne de 25 ms avec une charge CPU de 65%.
ou
● Envoyer 6,000 RPC/sec, avec une latence moyenne de 400 ms.
ou
● Servir 6,000 clients, avec une latence moyenne de 850ms.
Does it blend ?
En stressant un peu sa stack WAMP, on peut :
● Envoyer 1,000 PubSub/sec de 32+ bytes vers 1,000 abonnés pour
une latence moyenne de 25 ms avec une charge CPU de 65%.
ou
● Envoyer 6,000 RPC/sec, avec une latence moyenne de 400 ms.
ou
● Servir 6,000 clients, avec une latence moyenne de 850ms.
Sur un Rasberry Pi :)
Par où commencer ?
Choisissez votre langage, et écrivez un petit client
à l'aide du serveur de démo :
http://crossbar.io/docs/Choose-your-Weapon/

Contenu connexe

En vedette

Introduction to WAMP, a protocol enabling PUB/SUB and RPC over Websocket
Introduction to WAMP, a protocol enabling PUB/SUB and RPC over WebsocketIntroduction to WAMP, a protocol enabling PUB/SUB and RPC over Websocket
Introduction to WAMP, a protocol enabling PUB/SUB and RPC over Websocket
sametmax
 
Java API for WebSocket 1.0: Java EE 7 and GlassFish
Java API for WebSocket 1.0: Java EE 7 and GlassFishJava API for WebSocket 1.0: Java EE 7 and GlassFish
Java API for WebSocket 1.0: Java EE 7 and GlassFish
Arun Gupta
 
Adding Real-time Features to PHP Applications
Adding Real-time Features to PHP ApplicationsAdding Real-time Features to PHP Applications
Adding Real-time Features to PHP Applications
Ronny López
 
ZeroMQ Is The Answer
ZeroMQ Is The AnswerZeroMQ Is The Answer
ZeroMQ Is The Answer
Ian Barber
 
IoT Toulouse : introduction à mqtt
IoT Toulouse : introduction à mqttIoT Toulouse : introduction à mqtt
IoT Toulouse : introduction à mqtt
Julien Vermillard
 
Chp2 - Vers les Architectures Orientées Services
Chp2 - Vers les Architectures Orientées ServicesChp2 - Vers les Architectures Orientées Services
Chp2 - Vers les Architectures Orientées Services
Lilia Sfaxi
 
W cibercultura y educacion_artistica[1]nov 2010
W cibercultura y educacion_artistica[1]nov 2010W cibercultura y educacion_artistica[1]nov 2010
W cibercultura y educacion_artistica[1]nov 2010
Re play Arts go
 
Digita publishing. Un mercado en auge.
Digita publishing. Un mercado en auge.Digita publishing. Un mercado en auge.
Digita publishing. Un mercado en auge.
Mondays at Work
 
10 accions de Marketing Digital per Associacions Culturals
10 accions de Marketing Digital per Associacions Culturals10 accions de Marketing Digital per Associacions Culturals
10 accions de Marketing Digital per Associacions Culturals
Montserrat Peñarroya
 
Lucibel éclaire la nouvelle QASHQAI.
Lucibel éclaire la nouvelle QASHQAI.Lucibel éclaire la nouvelle QASHQAI.
Lucibel éclaire la nouvelle QASHQAI.
Lucibel SA
 
Quand j t jeune
Quand j t jeuneQuand j t jeune
Quand j t jeune
Doug Doug
 
El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013
El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013
El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013
Guadalinfo Escañuela
 
Los tres mosqueteros
Los tres mosqueterosLos tres mosqueteros
Los tres mosqueteros
Lilia G. Torres Fernández
 
Reportage-photo "Regard neuf sur Gaza"
Reportage-photo "Regard neuf sur Gaza"Reportage-photo "Regard neuf sur Gaza"
Reportage-photo "Regard neuf sur Gaza"
Anthony Foussard
 
Galaxias Modificado
Galaxias ModificadoGalaxias Modificado
Galaxias Modificado
Pacaxiva
 
Bob esponja
Bob esponjaBob esponja
Bob esponja
pilardr8
 
Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...
Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...
Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...
Perfect People
 
Henry Morgan1
Henry Morgan1Henry Morgan1
Henry Morgan1
Na Lia
 
L'islam fausse religion
L'islam fausse religionL'islam fausse religion
L'islam fausse religion
Mircea Tivadar
 

En vedette (20)

Introduction to WAMP, a protocol enabling PUB/SUB and RPC over Websocket
Introduction to WAMP, a protocol enabling PUB/SUB and RPC over WebsocketIntroduction to WAMP, a protocol enabling PUB/SUB and RPC over Websocket
Introduction to WAMP, a protocol enabling PUB/SUB and RPC over Websocket
 
Java API for WebSocket 1.0: Java EE 7 and GlassFish
Java API for WebSocket 1.0: Java EE 7 and GlassFishJava API for WebSocket 1.0: Java EE 7 and GlassFish
Java API for WebSocket 1.0: Java EE 7 and GlassFish
 
Adding Real-time Features to PHP Applications
Adding Real-time Features to PHP ApplicationsAdding Real-time Features to PHP Applications
Adding Real-time Features to PHP Applications
 
ZeroMQ Is The Answer
ZeroMQ Is The AnswerZeroMQ Is The Answer
ZeroMQ Is The Answer
 
IoT Toulouse : introduction à mqtt
IoT Toulouse : introduction à mqttIoT Toulouse : introduction à mqtt
IoT Toulouse : introduction à mqtt
 
Middleware
MiddlewareMiddleware
Middleware
 
Chp2 - Vers les Architectures Orientées Services
Chp2 - Vers les Architectures Orientées ServicesChp2 - Vers les Architectures Orientées Services
Chp2 - Vers les Architectures Orientées Services
 
W cibercultura y educacion_artistica[1]nov 2010
W cibercultura y educacion_artistica[1]nov 2010W cibercultura y educacion_artistica[1]nov 2010
W cibercultura y educacion_artistica[1]nov 2010
 
Digita publishing. Un mercado en auge.
Digita publishing. Un mercado en auge.Digita publishing. Un mercado en auge.
Digita publishing. Un mercado en auge.
 
10 accions de Marketing Digital per Associacions Culturals
10 accions de Marketing Digital per Associacions Culturals10 accions de Marketing Digital per Associacions Culturals
10 accions de Marketing Digital per Associacions Culturals
 
Lucibel éclaire la nouvelle QASHQAI.
Lucibel éclaire la nouvelle QASHQAI.Lucibel éclaire la nouvelle QASHQAI.
Lucibel éclaire la nouvelle QASHQAI.
 
Quand j t jeune
Quand j t jeuneQuand j t jeune
Quand j t jeune
 
El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013
El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013
El barrenillo, el gran enemigo del olivar, dossier informativo Escañuela 2013
 
Los tres mosqueteros
Los tres mosqueterosLos tres mosqueteros
Los tres mosqueteros
 
Reportage-photo "Regard neuf sur Gaza"
Reportage-photo "Regard neuf sur Gaza"Reportage-photo "Regard neuf sur Gaza"
Reportage-photo "Regard neuf sur Gaza"
 
Galaxias Modificado
Galaxias ModificadoGalaxias Modificado
Galaxias Modificado
 
Bob esponja
Bob esponjaBob esponja
Bob esponja
 
Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...
Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...
Perfect People - Extraits Conférence LNE: Conseils recrutement fonctions comm...
 
Henry Morgan1
Henry Morgan1Henry Morgan1
Henry Morgan1
 
L'islam fausse religion
L'islam fausse religionL'islam fausse religion
L'islam fausse religion
 

Similaire à Présentation de WAMP.ws, le protocole pour faire du PUB/SUB et RPC over Websocket

Vert.x 3
Vert.x 3Vert.x 3
Vert.x 3
Xavier MARIN
 
Presentation
PresentationPresentation
Presentation
Bayrem GHARSELLAOUI
 
Messaging temps réel avec Go
Messaging temps réel avec GoMessaging temps réel avec Go
Messaging temps réel avec Go
Mickaël Rémond
 
Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...
Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...
Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...
MSDEVMTL
 
[FR] C'est quoi une API ?
[FR] C'est quoi une API ?[FR] C'est quoi une API ?
[FR] C'est quoi une API ?
OVHcloud
 
Push Notification
Push Notification Push Notification
Push Notification
ODC Orange Developer Center
 
8-socket.pdf
8-socket.pdf8-socket.pdf
8-socket.pdf
StyvePola1
 
Parisweb - javascript server side - par où commencer ?
Parisweb - javascript server side - par où commencer ?Parisweb - javascript server side - par où commencer ?
Parisweb - javascript server side - par où commencer ?
Quentin Adam
 
BreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseries
BreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseriesBreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseries
BreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseries
Xavier MARIN
 
Orchestrating Docker in production - TIAD Camp Docker
Orchestrating Docker in production - TIAD Camp DockerOrchestrating Docker in production - TIAD Camp Docker
Orchestrating Docker in production - TIAD Camp Docker
The Incredible Automation Day
 
12-Factor
12-Factor12-Factor
12-Factor
Luc Juggery
 
WebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
WebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbWebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
WebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
HINDGUENDOUZ
 
JAVA Chapitre2
JAVA Chapitre2JAVA Chapitre2
JAVA Chapitre2
Mohamed Ferchichi
 
Ysance conference - cloud computing - aws - 3 mai 2010
Ysance   conference - cloud computing - aws - 3 mai 2010Ysance   conference - cloud computing - aws - 3 mai 2010
Ysance conference - cloud computing - aws - 3 mai 2010
Ysance
 
Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...
Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...
Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...
Frédéric FAURE
 
Client riche et nouvelles technologies
Client riche et nouvelles technologiesClient riche et nouvelles technologies
Client riche et nouvelles technologies
Sébastien Letélié
 
SPA avec Angular et SignalR (FR)
SPA avec Angular et SignalR (FR)SPA avec Angular et SignalR (FR)
SPA avec Angular et SignalR (FR)
Rui Carvalho
 

Similaire à Présentation de WAMP.ws, le protocole pour faire du PUB/SUB et RPC over Websocket (20)

Vert.x 3
Vert.x 3Vert.x 3
Vert.x 3
 
_JCVFr
_JCVFr_JCVFr
_JCVFr
 
Presentation
PresentationPresentation
Presentation
 
Messaging temps réel avec Go
Messaging temps réel avec GoMessaging temps réel avec Go
Messaging temps réel avec Go
 
Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...
Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...
Sébastien Coutu: Copy this Meetup Devops - microservices - infrastructure imm...
 
[FR] C'est quoi une API ?
[FR] C'est quoi une API ?[FR] C'est quoi une API ?
[FR] C'est quoi une API ?
 
Apache Open SSL
Apache Open SSLApache Open SSL
Apache Open SSL
 
Push Notification
Push Notification Push Notification
Push Notification
 
8-socket.pdf
8-socket.pdf8-socket.pdf
8-socket.pdf
 
Parisweb - javascript server side - par où commencer ?
Parisweb - javascript server side - par où commencer ?Parisweb - javascript server side - par où commencer ?
Parisweb - javascript server side - par où commencer ?
 
BreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseries
BreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseriesBreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseries
BreizhCamp 2019 - IoT et open source hardware pour la collecte de timeseries
 
Orchestrating Docker in production - TIAD Camp Docker
Orchestrating Docker in production - TIAD Camp DockerOrchestrating Docker in production - TIAD Camp Docker
Orchestrating Docker in production - TIAD Camp Docker
 
Mysql
MysqlMysql
Mysql
 
12-Factor
12-Factor12-Factor
12-Factor
 
WebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
WebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbWebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
WebServices.pdfbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
 
JAVA Chapitre2
JAVA Chapitre2JAVA Chapitre2
JAVA Chapitre2
 
Ysance conference - cloud computing - aws - 3 mai 2010
Ysance   conference - cloud computing - aws - 3 mai 2010Ysance   conference - cloud computing - aws - 3 mai 2010
Ysance conference - cloud computing - aws - 3 mai 2010
 
Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...
Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...
Amazon Web Services User Group - France - 3 mai 2010 - Optimisation et Automa...
 
Client riche et nouvelles technologies
Client riche et nouvelles technologiesClient riche et nouvelles technologies
Client riche et nouvelles technologies
 
SPA avec Angular et SignalR (FR)
SPA avec Angular et SignalR (FR)SPA avec Angular et SignalR (FR)
SPA avec Angular et SignalR (FR)
 

Plus de sametmax

Courbe d'apprentissage d'un dev Front end
Courbe d'apprentissage d'un dev Front endCourbe d'apprentissage d'un dev Front end
Courbe d'apprentissage d'un dev Front end
sametmax
 
Bactérie: à quelle heure reste-t-il la moitié de l'espace ?
Bactérie: à quelle heure reste-t-il la moitié de l'espace ?Bactérie: à quelle heure reste-t-il la moitié de l'espace ?
Bactérie: à quelle heure reste-t-il la moitié de l'espace ?
sametmax
 
Bactéries: doublement de toute la consommation
Bactéries: doublement de toute la consommationBactéries: doublement de toute la consommation
Bactéries: doublement de toute la consommation
sametmax
 
Bacteries: le poids des nouvelles découvertes
Bacteries: le poids des nouvelles découvertesBacteries: le poids des nouvelles découvertes
Bacteries: le poids des nouvelles découvertes
sametmax
 
Bacteries: à 11h55, il reste 97% de la boîte
Bacteries: à 11h55, il reste 97% de la boîteBacteries: à 11h55, il reste 97% de la boîte
Bacteries: à 11h55, il reste 97% de la boîte
sametmax
 

Plus de sametmax (6)

Courbe d'apprentissage d'un dev Front end
Courbe d'apprentissage d'un dev Front endCourbe d'apprentissage d'un dev Front end
Courbe d'apprentissage d'un dev Front end
 
Bactérie: à quelle heure reste-t-il la moitié de l'espace ?
Bactérie: à quelle heure reste-t-il la moitié de l'espace ?Bactérie: à quelle heure reste-t-il la moitié de l'espace ?
Bactérie: à quelle heure reste-t-il la moitié de l'espace ?
 
Bactéries: doublement de toute la consommation
Bactéries: doublement de toute la consommationBactéries: doublement de toute la consommation
Bactéries: doublement de toute la consommation
 
Bacteries: le poids des nouvelles découvertes
Bacteries: le poids des nouvelles découvertesBacteries: le poids des nouvelles découvertes
Bacteries: le poids des nouvelles découvertes
 
Bacteries: à 11h55, il reste 97% de la boîte
Bacteries: à 11h55, il reste 97% de la boîteBacteries: à 11h55, il reste 97% de la boîte
Bacteries: à 11h55, il reste 97% de la boîte
 
Bacteries
BacteriesBacteries
Bacteries
 

Présentation de WAMP.ws, le protocole pour faire du PUB/SUB et RPC over Websocket

  • 2. WAMPprotocol (Web Application Messaging Protocol) ≠ WAMP server stack (Windows, Apache, MySQL, PHP)
  • 3. WAMP.ws est un protocole créé pour tirer parti des websockets (http://wamp.ws/) Il permet de faire communiquer en temps réel des technologies différentes ainsi que des processus et machines différentes.
  • 4. WAMP.ws offre deux outils RPC PUB/SUB Depuis et vers : ● JS (Node et Navigateur) ● Python (pur) ● C++ ● Java ● Objective-C ● PHP ● C# &
  • 5. RPC : Remote Procedure Call ● Permet d'appeler une fonction d'un autre code à distance à travers une websocket. ● Asynchrone, performant, propre, léger. Mais simple. ● Paramètres et valeurs de retour peuvent être : arrays, maps, nombres et chaînes. ● Marche entre deux langages différents. ● Marche entre processus locaux ou à travers internet.
  • 6. RPC – Exemple 1 Tout ce qu'on fait d'habitude avec AJAX Navigateur Comme un GET /user/profile, mais plus rapide puisque via Websocket. Serveur getUserProfile() {'user' : 'sam', 'id' : 1} RPC
  • 7. RPC – Exemple 2 Communication entre navigateurs Navigateur de Sam Si on code un jeu d'échecs et que je bouge un pion, mon navigateur peut dire directement à celui de Max de bouger le pion sur son écran. moveQueen('A', '5') RPC Navigateur de Max
  • 8. RPC – Exemple 3 Push de données vers le navigateur Si on code un jeu d'échecs avec une intelligence artificielle et que c'est au tour du bot, il peut directement dire au navigateur du joueur humain de bouger le pion sur son écran. moveQueen('A', '5') RPC NavigateurServeur
  • 9. RPC – Exemple 4 Microservices Plutôt que d'avoir une grosse application centrale qui fait tout, on peut avoir plusieurs processus séparés qui font chacun une tâche. Avantage : on peut les réutiliser, les partager entre projets, les redémarrer indépendamment, les répartir sur plusieurs serveurs... moveQueen('A', '5') RPC Navigateur Auth IA ChatCompétition SendMsg('yolo')getPool()login()
  • 10. RPC – Exemple 5 Y a pas que le navigateur dans la vie Différents services peuvent communiquer entre eux par le même biais. Même protocole, même API, quels que soient les langages dans lesquels ils sont écrits. Qu'ils soient sur le même serveur ou non. On peut ainsi déléguer des tâches sur d'autres services, ou machines. RPC Python Rasberry Pi NodeJSArduino getVideo() toggleLED()
  • 11. Montrez-moi le code ! Voici un exemple simple d'un navigateur appelant une fonction définie dans un autre navigateur.
  • 13. index.html <!DOCTYPE html><html> <head> <script src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn. min.jgz" type="text/javascript"></script> </head><body> <p id="baby">Appelez callMeMaybe() depuis un autre navigateur :)</p> </body><script> // Connexion au serveur de test WAMP. var connection = new autobahn.Connection({ url: 'wss://demo.crossbar.io/ws', realm: 'realm1' }); // Lancer ce code une fois que la connexion est réussie. connection.onopen = function (session) { // On déclare que cette fonction est appelable // par un autre client session.register('callMeMaybe', function(message){ // On change le contenu de la page. document.getElementById('baby').innerHTML = message // On retourne la userAgent du navigateur comme ça vous pouvez // tester sur 2 nav différents et voir qu'ils communiquent return navigator.userAgent; }); }; // Ouvrir la connexion. connection.open(); </script></html>
  • 14. button.html <!DOCTYPE html><html> <head> <script src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn. min.jgz" type="text/javascript"></script> </head><body> <p><button onClick='callIt()'>Call It, bobby !</button></p> </body><script> // Connexion au serveur de test WAMP. var connection = new autobahn.Connection({ url: 'wss://demo.crossbar.io/ws', realm: 'realm1' }); // Lancer ce code une fois que la connexion est réussie. connection.onopen = function(session) { callIt = function(){ /* Appel de la fonction callMeMaybe() sur l'autre nav */ session.call("callMeMaybe", ['I called baby !']) /* L'appel retourne une promesse */ .then(function(userAgent){ alert(userAgent); }); return false; } }; // Ouvrir la connexion. connection.open(); </script></html>
  • 15. Comment ça marche ? ● Chaque code utilisant WAMP.ws est un client qui a besoin d'une bibliothèque dédiée à cela. ● Il faut un serveur central, entre tous les clients. Comme avec RabbitMQ pour AMQP. Ce n'est pas du P2P à la WebRTC. ● Les libs et le serveur sont libres, à disposition, prêts à l'usage. ● Il existe des moyens de sécurisation (permissions, chiffrement). Ceci est une démo simple.
  • 16. RPC – Sous le capot Communication entre navigateurs Navigateur de Sam Même si on ne le voit pas en codant, il y a un routeur qui transmet les messages. Il faut ce routeur installé quelque part pour que WAMP fonctionne. Navigateur de Max moveQueen('A', '5') Routeur
  • 17. RPC – Sous le capot Communication entre navigateurs AutoBahnJS moveQueen('A', '5') AutoBahnJSCrossbar.io AutobahnX (AutobahnPython, AutobahnJS, AutobanCpp…) sont les noms des libs les plus utilisées pour permettre à votre code, le client, de parler WAMP. Crossbar.io est le nom du routeur le plus complet.
  • 18. Pour vous ● Vous allez uniquement coder le client, avec une des bibliothèques Autobahn. ● Pour vos tests vous pouvez utiliser le routeur de démonstration (wss://demo.crossbar.io/ws). Il n'y a rien à installer. ● En production, vous installez crossbar.io. Un peu comme on installe Apache ou Nginx pour faire du HTTP.
  • 19. PUB/SUB ● Un client s'abonne (SUBscribe) à un sujet. ● Un autre client publie un message (PUBlish) sur ce sujet. ● Tous les clients abonnés à ce sujet en particulier reçoivent le message.
  • 20. PUB/SUB ● Un client s'abonne (SUBscribe) à un sujet. ● Un autre client publie un message (PUBlish) sur ce sujet. ● Tous les clients abonnés à ce sujet en particulier reçoivent le message. Même principe que RPC, mais permet d'envoyer un messages à 0 ou N clients, pas juste 1. Néanmoins, il n'y a pas de valeur de retour possible.
  • 21. PUB/SUB – Exemple 1 Notifications Navigateur Le serveur vient de mettre à disposition une nouvelle vidéo. Tous les navigateurs reçoivent immédiatement l'information et l'affichent sur la page. Serveur {'title: 'Chat rigolo', 'id' : 2} SUB : abonnés au sujet « nouvelle vidéo » Navigateur Navigateur PUB
  • 22. PUB/SUB – Exemple 2 Synchronisation Web Crawler Tous vos composants sont toujours au courant de tout ce qu'ils doivent savoir, où qu'ils soient. Ici, si l'admin change la valeur d'un paramètre, il peut prévenir tous les processus concernés. Serveur d'encodage Site Web SUB : abonnés au sujet « changement d'un paramètre » Admin {'settings': 'debug', 'oldValue' : false, 'newValue' : true}
  • 23. Montrez-moi le code ! Même exemple que pour RPC, mais cette fois, on peut ouvrir index.html dans plusieurs tabs à la fois.
  • 24. Résultat attendu Index.html button.html PUB Callback (A SUB préalablement) Si on ouvre 10 tabs avec index.html, les 10 vont réagir. Mais button.html ne peut pas récupérer de valeur en retour.
  • 25. index.html <!DOCTYPE html><html> <head> <script src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn. min.jgz" type="text/javascript"></script> </head><body> <p id="baby">J'attends des nouvelles de fascinatingSubject</p> </body><script> // Connexion au serveur de test WAMP. var connection = new autobahn.Connection({ url: 'wss://demo.crossbar.io/ws', realm: 'realm1' }); // Lancer ce code une fois que la connexion est réussie. connection.onopen = function (session) { // On déclare que cette fonction est appelée si il y a des nouvelles // à propos de ce sujet session.subscribe('fascinatingSubject', function(message){ // On change le contenu de la page. document.getElementById('baby').innerHTML = message // Pas de valeur de retour, le PUB/SUB est à sens unique }); }; // Ouvrir la connexion. connection.open(); </script></html>
  • 26. button.html <!DOCTYPE html><html> <head> <script src="https://autobahn.s3.amazonaws.com/autobahnjs/latest/autobahn. min.jgz" type="text/javascript"></script> </head><body> <p><button onClick='sayIt()'>Say It, bobby !</button></p> </body><script> // Connexion au serveur de test WAMP. var connection = new autobahn.Connection({ url: 'wss://demo.crossbar.io/ws', realm: 'realm1' }); // Lancer ce code une fois que la connexion est réussie. connection.onopen = function(session) { sayIt = function(){ /* Publication sur le sujet fascinatingSubject */ session.publish("fascinatingSubject", ['Amazing !']); // Pas de retour de valeur puisqu'on ne sait pas quels // clients vont recevoir le message } }; // Ouvrir la connexion. connection.open(); </script></html>
  • 28. Que faire de tout ça ? ● Des apps Web complètes. WAMP est un bon compagnon de frameworks comme AngularJS et remplace AJAX ou les websockets à la main pour une mise à jour en temps réel. ● Des grappes d'objets connectés (IoT, Rasberry PI, Arduino…) : remplace MQTT. ● Des microservices : authentification, logging, encodage video. Remplace AMQP et ZeroMQ. ● Des jeux vidéos. ● Des applications collaboratives (à la Google Doc). ● Des apps Androids ou iOS natives.
  • 29. A propos de crossbar.io ● Crossbar est un routeur WAMP complet. Sans routeur, les clients ne peuvent se parler. ● Il doit être accessible via websocket. ● Il peut gérer le cycle de vie des clients. ● Il peut aussi gérer le cycle de vie de processus non WAMP : c'est un gestionnaire de processus complet (comme supervisord) afin de faciliter les architectures à base de plusieurs micro-services. ● Il intègre même un serveur Web si nécessaire.
  • 30. Où est le piège ? ● Technologie encore jeune. WAMP V1 vient d'être déprécié en faveur de WAMP 2. ● Des outils qui restent à créer : authentification utilisateur, debugage avancé... ● Obligation d'être asynchrone : pour le moment incompatible avec WSGI (et donc Django). Un bridge est en projet. ● Une doc toujours en évolution (mais je viens d'être embauché pour ça).
  • 31. Does it blend ? En stressant un peu sa stack WAMP, on peut : ● Envoyer 1,000 PubSub/sec de 32+ bytes vers 1,000 abonnés pour une latence moyenne de 25 ms avec une charge CPU de 65%. ou ● Envoyer 6,000 RPC/sec, avec une latence moyenne de 400 ms. ou ● Servir 6,000 clients, avec une latence moyenne de 850ms.
  • 32. Does it blend ? En stressant un peu sa stack WAMP, on peut : ● Envoyer 1,000 PubSub/sec de 32+ bytes vers 1,000 abonnés pour une latence moyenne de 25 ms avec une charge CPU de 65%. ou ● Envoyer 6,000 RPC/sec, avec une latence moyenne de 400 ms. ou ● Servir 6,000 clients, avec une latence moyenne de 850ms. Sur un Rasberry Pi :)
  • 33. Par où commencer ? Choisissez votre langage, et écrivez un petit client à l'aide du serveur de démo : http://crossbar.io/docs/Choose-your-Weapon/