是否有可能使用Nodejs和Socket.io更新页面的单个部分？

我正在尝试创build一个基本的Node应用程序，每当客户端连接时，我想更新页面上显示的计数器。 （我的目标是创build这个应用程序的最简单，可学习的forms来演示节点给我的讲师）。

服务器端应用程序片段：

build立连接

var clients = 0; io.sockets.on('connection', function (socket) { socket.on('connect', function () { clients += 1 }); socket.on('disconnect', function(){ clients -= 1 }); }); 

呈现页面

 app.get(navigation.chat.page, function(req, res){ res.render('chat', { title: navigation.chat.title, connected: clients }); }); 

聊天页面jade模板片段：

  span#client_count #{connected} | connected clients 

客户端的jQuery，Socket.io和JavaScript

 var socket = io.connect('http://localhost'); $(document).ready(function(){ socket.on('connect', socket.emit('connect')); }); 

问题：连接的客户端数量仅在页面刷新时更新。 我想这个号码是asynchronous更新的。 我很新的节点，socket.io和快递，所以我不确定如何解决这个问题！

Answer 1

而不是在客户端递增，更好地保持服务器端的计数器值，在连接上递增和在断开 IO事件时递减。 然后，您可以发送更新的计数器（在相同的事件处理程序中值已更改）。 在客户端，用计数器监听事件，当收到时，用html代替值。

服务器：

 var users_count = 0; io.sockets.on('connection', function (socket) { //on connection, update users count ++users_count; //send it to every opened socket io.sockets.emit('users_count', users_count); //when this socket is closed socket.on('disconnect', function () { //user disconnected --users_count; //emit to every opened socket, so everyone has up to date data io.sockets.emit('users_count', users_count); }); }); 

客户：

 jQuery(function($){ //connect to localhost var socket = io.connect('http://localhost'); //handle users_count event, by updating our html socket.on('users_count', function(data){ $('#client_count').text(data); }); });