Skip to content

Commit 3e8ecdf

Browse files
majekmajek
committed
Merge pull request #5 from kmlx/master
adding express3 to /examples
2 parents a1cd240 + 3eca6a6 commit 3e8ecdf

File tree

4 files changed

+179
-0
lines changed

4 files changed

+179
-0
lines changed

‎examples/sockjs-express3/README.md

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
WebSocket-multiplex SockJS example
2+
==================================
3+
4+
To run this example, first install dependencies:
5+
6+
npm install
7+
8+
And run a server:
9+
10+
node server.js
11+
12+
13+
That will spawn an http server at http://127.0.0.1:9999/ which will
14+
serve both html (served from the current directory) and also SockJS
15+
service (under the [/multiplex](http://127.0.0.1:9999/multiplex)
16+
path).
17+
18+
With that set up, WebSocket-multiplex is able to push three virtual
19+
connections over a single SockJS connection. See the code for details.

‎examples/sockjs-express3/index.html

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
<!doctype html>
2+
<html><head>
3+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
4+
<script src="http://cdn.sockjs.org/sockjs-0.3.min.js"></script>
5+
<script src="http://cdn.sockjs.org/websocket-multiplex-0.1.js"></script>
6+
<style>
7+
.box {
8+
width: 300px;
9+
float: left;
10+
margin: 0 20px 0 20px;
11+
}
12+
.box div, .box input {
13+
border: 1px solid;
14+
-moz-border-radius: 4px;
15+
border-radius: 4px;
16+
width: 100%;
17+
padding: 0px;
18+
margin: 5px;
19+
}
20+
.box div {
21+
border-color: grey;
22+
height: 300px;
23+
overflow: auto;
24+
}
25+
.box input {
26+
height: 30px;
27+
}
28+
h1 {
29+
margin-left: 75px;
30+
}
31+
body {
32+
background-color: #F0F0F0;
33+
font-family: "Arial";
34+
}
35+
</style>
36+
</head><body lang="en">
37+
<h1>SockJS Multiplex example</h1>
38+
39+
<div id="first" class="box">
40+
<div></div>
41+
<form><input autocomplete="off" value="Type here..."></input></form>
42+
</div>
43+
44+
<div id="second" class="box">
45+
<div></div>
46+
<form><input autocomplete="off"></input></form>
47+
</div>
48+
49+
<div id="third" class="box">
50+
<div></div>
51+
<form><input autocomplete="off"></input></form>
52+
</div>
53+
54+
<script>
55+
// Pipe - convenience wrapper to present data received from an
56+
// object supporting WebSocket API in an html element. And the other
57+
// direction: data typed into an input box shall be sent back.
58+
var pipe = function(ws, el_name) {
59+
var div = $(el_name + ' div');
60+
var inp = $(el_name + ' input');
61+
var form = $(el_name + ' form');
62+
63+
var print = function(m, p) {
64+
p = (p === undefined) ? '' : JSON.stringify(p);
65+
div.append($("<code>").text(m + ' ' + p));
66+
div.append($("<br>"));
67+
div.scrollTop(div.scrollTop() + 10000);
68+
};
69+
70+
ws.onopen = function() {print('[*] open', ws.protocol);};
71+
ws.onmessage = function(e) {print('[.] message', e.data);};
72+
ws.onclose = function() {print('[*] close');};
73+
74+
form.submit(function() {
75+
print('[ ] sending', inp.val());
76+
ws.send(inp.val());
77+
inp.val('');
78+
return false;
79+
});
80+
};
81+
82+
var sockjs_url = '/multiplex';
83+
var sockjs = new SockJS(sockjs_url);
84+
85+
var multiplexer = new WebSocketMultiplex(sockjs);
86+
var ann = multiplexer.channel('ann');
87+
var bob = multiplexer.channel('bob');
88+
var carl = multiplexer.channel('carl');
89+
90+
pipe(ann, '#first');
91+
pipe(bob, '#second');
92+
pipe(carl, '#third');
93+
94+
$('#first input').focus();
95+
</script>
96+
</body></html>

‎examples/sockjs-express3/package.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"name" : "websocket-multiplex-sockjs-express3-example",
3+
"version" : "0.0.0-unreleasable",
4+
"dependencies" : {
5+
"express" : "3.0.0",
6+
"sockjs" : "0.3.x",
7+
"websocket-multiplex" : "*"
8+
}
9+
}

‎examples/sockjs-express3/server.js

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
var http = require('http');
2+
var express = require('express');
3+
var sockjs = require('sockjs');
4+
5+
var websocket_multiplex = require('websocket-multiplex');
6+
7+
8+
// 1. Setup SockJS server
9+
var sockjs_opts = {sockjs_url: "http://cdn.sockjs.org/sockjs-0.3.min.js"};
10+
var service = sockjs.createServer(sockjs_opts);
11+
12+
13+
// 2. Setup multiplexing
14+
var multiplexer = new websocket_multiplex.MultiplexServer(service);
15+
16+
var ann = multiplexer.registerChannel('ann');
17+
ann.on('connection', function(conn) {
18+
conn.write('Ann says hi!');
19+
conn.on('data', function(data) {
20+
conn.write('Ann nods: ' + data);
21+
});
22+
});
23+
24+
var bob = multiplexer.registerChannel('bob');
25+
bob.on('connection', function(conn) {
26+
conn.write('Bob doesn\'t agree.');
27+
conn.on('data', function(data) {
28+
conn.write('Bob says no to: ' + data);
29+
});
30+
});
31+
32+
var carl = multiplexer.registerChannel('carl');
33+
carl.on('connection', function(conn) {
34+
conn.write('Carl says goodbye!');
35+
// Explicitly cancel connection
36+
conn.end();
37+
});
38+
39+
40+
// 3. Express server
41+
var app = express();
42+
var server = http.createServer(app);
43+
44+
service.installHandlers(server, {prefix:'/multiplex'});
45+
46+
console.log(' [*] Listening on 0.0.0.0:9999' );
47+
app.listen(9999, '0.0.0.0');
48+
49+
app.get('/', function (req, res) {
50+
res.sendfile(__dirname + '/index.html');
51+
});
52+
53+
app.get('/multiplex.js', function (req, res) {
54+
res.sendfile(__dirname + '/multiplex.js');
55+
});

0 commit comments

Comments
 (0)