[Article] Première application Node.js et HTML5
:salut:
Romain Maton, de Web Tambouille vous propose la suite de sa série consacrée à Node.js : Première application Node.js et HTML5.
N'hésitez pas à faire part de vos remarques et commentaires sur cet article.
:fleche: Tout ce que vous devez savoir sur Node.js
:fleche: Cloud9 : IDE pour le développement JavaScript et Node.js
:fleche: Première application Node.js et HTML5
:merci: à lui !
Adapation du code source de l'exemple
Bonjour,
merci pour cette exemple d'utilisation de websocket et nodejs.
Je débute avec cette techno, et j'ai trouvé cela très instructif et très intéressant :ccool:
Pour tester l'exemple, j'ai eu quelques soucis car les version d'express et de socket.io ont changé, et l'exemple de code ne fonctionnait plus.
En effet, j'ai les versions suivantes :
- node : v0.10.18
- express : 3.4.0
- socket.io : 0.9.16
sous Ubuntu 12.04 64 bits
Je me permets de poster la correction que j'ai fait au niveau de d'index.html
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40
| <html>
<head>
<title>Socket IO Demo</title>
<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var sock = io.connect('http://127.0.0.1:8333');;
sock.on('message', function(data) {
var obj = JSON.parse(data);
if (obj.message) {
$('#message').text(obj.message);
} else {
$('#timestamp').text(obj.timestamp);
$('#clients').text(obj.clients);
}
});
$("#poke").click(function() {
sock.send("Poke !");
});
});
</script>
</head>
<body>
<div>
<h2>Démo Node.js + Socket IO</h2>
<label for="timestamp">Timestamp</label>
<div id="timestamp"></div>
<label for="clients">Clients</label>
<div id="clients"></div>
<label for="message">Message</label>
<div id="message"></div>
<p>
<button id="poke">Send poke !</button>
</p>
</div>
</body>
</html> |
et pour server.js :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50
| // import lib
var express = require('express');
var http = require('http');
var io = require('socket.io');
// init express
var app = express();
app.configure(function() {
app.use(express.static(__dirname + '/public'));
});
app.get('/', function(req, res, next) {
res.render('./public/index.html');
});
// init http server
var server = http.createServer(app);
server.listen(8333);
// init socket
var socket = io.listen(server);
var allClients = 0;
var clientId = 1;
socket.on('connection', function(client) {
var my_timer;
var my_client = {
"id" : clientId,
"obj" : client
};
clientId += 1;
allClients += 1;
my_timer = setInterval(function() {
my_client.obj.send(JSON.stringify({
"timestamp" : (new Date()).getTime(),
"clients" : allClients
}));
}, 1000);
client.on('message', function(data) {
my_client.obj.broadcast.send(JSON.stringify({
"message" : "poke send by client " + my_client.id
}));
console.log(data);
});
client.on('disconnect', function() {
clearTimeout(my_timer);
allClients -= 1;
console.log('disconnect');
});
}); |
Encore un grand merci pour cet article :bravo: