3. WAMP
is a protocol created to embrace the power of
websockets
(http://wamp.ws/)
It enables different technologies, processes
and machines to communicate with each
others, in real time.
4. WAMP offers 2 tools
RPC
PUB/SUB
From and to :
● JS (Node & browser ≥ IE10)
● Python (pure)
● C++
● Java
● Objective-C
● PHP
● C#
&
5. RPC : Remote Procedure Call
● Allows to call a function from another code
remotely via a websocket.
● Asynchronous, fast, clean, light. But Simple.
● Parameters and return values can be: arrays,
mappings, numbers and strings.
● Works between different langages.
● Works between local processes or accross
Internet.
6. RPC – Example 1
Everything you usually do with AJAX
Browser
Just like a GET /user/profile, but faster since via Websocket.
Server
getUserProfile()
{'user' : 'bob', 'id' : 1}
RPC
7. RPC – Example 2
Communication between browsers
Bob's
browser
If you code a chess game and Bob moves a piece, his browser can
directly tells Jane's to move the piece on her screen.
moveQueen('A', '5')
RPC
Jane's
browser
8. RPC – Example 3
Push data to the browser
If you code a chess game with an AI and it's the bot's turn, the server can directly
tell the human player's browser to move the piece on its screen.
moveQueen('A', '5')
RPC
BrowserServer
9. RPC – Example 4
Microservices
Instead of a big central application, you can have several separated processes,
each of them doing one task. Benefits : you can reuse them, share them between
projects, restart them independantly, dispatch them on several servers...
moveQueen('A', '5')
RPC
Browser
Auth AI ChatTournament
SendMsg('yolo')getPool()login()
10. RPC – Example 5
The browser is not everything
You can mix as many platforms as you need. You can control your Python powered
Arduino Yun from a desktop app or just make it react to the sensor placed on
your JS powered Tessel. The IoT feels right at home.
RPC
Tessel +
Accelerometer
Destop AppArduino
Yun
startServo()
startServo()
11. Show me the code !
Here is a simple example of a browser calling
a function defined in another browser.
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">Call callMeMaybe() from another browser :)</p>
</body><script>
// Connecting to the WAMP public test server.
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// This code runs once the connection is opened.
connection.onopen = function (session) {
// We expose this function so it can be called
// by another client
session.register('callMeMaybe', function(message){
// Let's change the content of the page.
document.getElementById('baby').innerHTML = message
// We return the browser userAgent so we can test it
// on 2 different browsers and see they communicate
return navigator.userAgent;
});
};
// Open the connection.
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>
// Connection to the test server
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// Runs this code once the connection is opened.
connection.onopen = function(session) {
callIt = function(){
// Call the function callMeMaybe() on the other browser
session.call("callMeMaybe", ['I called baby !'])
// This returns a promise */
.then(function(userAgent){
alert(userAgent);
});
return false;
}
};
// Opens the connection.
connection.open();
</script></html>
15. How does it work ?
● Each piece of code using WAMP is a client,
needing a dedicated library to do so.
● You need a central server between all clients.
Like RabbitMQ for AMQP. It's not P2P like
WebRTC.
● The libs and server are free, available now and
ready to be used.
● There are security features (permissions,
encryption). This is just a simple demo.
16. RPC – Under the hood
Communication between browsers
Bob's
browser
Even if you don't see it while coding, a router relays all the messages.
This router needs to be installed somewhere for WAMP to work.
Jane's
browser
moveQueen('A', '5')
Router
17. RPC – Under the hood
Communication between browsers
AutoBahnJS
moveQueen('A', '5')
AutoBahnJSCrossbar.io
AutobahnX (AutobahnPython, AutobahnJS, AutobahnCpp…) are the name of the
de facto libs to enable your code, the client, to speak WAMP.
Crossbar.io is the name of the most full featured router.
18. From your perspective
● You only need to code the clients, with one of
the Autobahn libs.
● For your tests, you can use the public demo
router (wss://demo.crossbar.io/ws). There is
nothing to install.
● Once you get serious, you install crossbar.io.
Just like you would do with Apache or Nginx for
HTTP.
19. PUB/SUB
● A client SUBscribes to a topic.
● Another client PUBlishes a message about this topic.
● All subscribers interested in this topic receive the
message.
20. PUB/SUB
● A client SUBscribes to a topic.
● Another client PUBlishes a message about this topic.
● All subscribers interested on this topic receive the
message.
Same as with RPC, but you can send
messages to 0 or N clients, not just 1. However,
there is no way to get a return value.
21. PUB/SUB – Example 1
Notifications
Browser
The server just made a new video available. All browsers receive
immediately this information and display it on the page.
Server
{'title: 'Funny cat', 'id' : 2}
SUB : subscribed to « new video »
Browser Browser
PUB
22. PUB/SUB – Exemple 2
Synchronisation
Web
crawler
All your components are always aware of everything they need to
know, wherever they are. Here, the admin changes a setting value,
and can notify all processes.
Encoding
server
Web site
SUB : subscribed to « setting changed »
Admin
{'settings': 'debug',
'oldValue' : false,
'newValue' : true}
23. Show me the code !
Same as RPC, but this time, you can open
index.html in several tabs at the same time.
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">I'm expecting news about fascinatingSubject</p>
</body><script>
// Connection to the WAMP test public server
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// Runs this code once the connection is opened.
connection.onopen = function (session) {
// We ask for this function to be called if there
// are any news about this topic.
session.subscribe('fascinatingSubject', function(message){
// Let's change the content of the page.
document.getElementById('baby').innerHTML = message
// No return value, PUB/SUB is a one way lane.
});
};
// Opens the connection.
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>
// Connection to the WAMP test server
var connection = new autobahn.Connection({
url: 'wss://demo.crossbar.io/ws',
realm: 'realm1'
});
// Runs this code once the connection is opened.
connection.onopen = function(session) {
sayIt = function(){
// We publish something about fascinatingSubject
session.publish("fascinatingSubject", ['Amazing !']);
// No return value since we don't know which clients
// are going to get the message.
}
};
// Opens the connection.
connection.open();
</script></html>
28. What to do with all this ?
● Complete Web apps: WAMP is a great companion for
frameworks such as AngularJS and replace AJAX or manual
websockets to get real time updates.
● Small connected devices (IoT, Raspberry PI, Arduino…) :
replace MQTT.
● Micro-services: authentication, logging, video encoding...
Replace AMQP and ZeroMQ.
● Video games.
● Collaborative apps (Google Doc-like).
● Androids or iOS native apps.
29. About Crossbar.io
● Crossbar.io is a full featured WAMP router.
Without router, clients can't talk to each others.
● It should be accessible via websockets.
● It can manage clients life cycle.
● It can also manage non WAMP processes life
cycle (like supervisord) to make it easy for you
to create micro-services oriented systems.
● It even packs a Web servers if you need it.
30. What's the catch?
● It's a young technology. WAMP V1 was recently
deprecated by WAMP 2.
● Some tools still need to be created : user
authentication, advanced debugging...
● Being asynchronous is a requirement: for now, it
means WSGI (and so Django) is not compatible. An
HTTP bridge is in discussion.
● The documentation is moving a lot. But somebody
was hired to settle this.
31. Will it blend ?
If you stress a bit your WAMP stack, you can :
● Send 32+ bytes in 1,000 PubSub/sec to 1,000 clients with an
average latency of 25 ms and 65% CPU load.
or
● Send 6,000 RPC/sec, with an average latency of 400 ms.
or
● Serve 6,000 clients, with an average latency of 850ms.
On a Raspberry Pi :)
32. Where to start ?
Choose your language, and start writing a small
client using the public test server:
http://crossbar.io/docs/Choose-your-Weapon/
Or check out the demos :
https://demo.crossbar.io/
