如何将强大的file upload连接到Node.js中的socket.io

我是节点初学者，我试图通过强大的设置一个多文件图像上传，将有一个进度条，还有一个callback后，每个上传将dynamic加载所有图像到上传完成后，同一页。 我知道我需要使用socket.io在上传开始后与浏览器交互。 Formidable有一个“进度”的事件监听器。 我需要我的客户端脚本来接收收到的字节创build一个上传栏。 文件完成上传后，我想socket.io传递给客户端的图像上传的URL，使客户端可以加载图像，并将其附加到dynamic的DOM。 这是我到目前为止的代码。

我的问题是如何构build“进度”的事件监听器内的socket.io代码，以便它可以广播到客户端？

下面是一些松散的伪代码，告诉你我在说什么：

//formidable code: app.post('/new', function(req,res){ var form = new formidable.IncomingForm(); form.addListener('progress', function(bytesReceived, bytesExpected){ //Socket.io interaction here?? }); form.uploadDir = __dirname + '/public/images/'; form.on('file', function(field, file) { //rename the incoming file to the file's name fs.rename(file.path, form.uploadDir + "/" + file.name); console.log(form.uploadDir + "/" + file.name); }) }); //socket.io code io.sockets.on('connection', function (socket) { socket.on('upload', function (msg) { socket.broadcast.emit('progress', bytesReceived); }); }); 

Answer 1

我使用了node-formidable v1.0.14和socket.io 1.0.0-pre。

当客户端发送一个请求时，就会build立一个连接，服务器将根据他的会话ID为这个客户端创build一个空间。

之后在进度事件中，我们将把这个百分比广播给房间里的一个客户。

在这里你可以find更多关于房间的信息： https : //github.com/LearnBoost/socket.io/wiki/Rooms

服务器app.js（主，启动时）：

 io.on('connection', function (socket) { console.log('CONNECTED'); socket.join('sessionId'); }); 

服务器POST：

 form.on('progress' , function (bytesRecieved , bytesExpected) { console.log('received: ' + bytesRecieved); io.sockets.in('sessionId').emit('uploadProgress', (bytesRecieved * 100) / bytesExpected); }); 

客户：

 var socket = io.connect('http://localhost:9000'); socket.on('uploadProgress' , function (percent){ alert(percent); }); 

当你想与会议合作，这可能会有所帮助： http : //www.danielbaulig.de/socket-ioexpress/#comment-11315

Answer 2

这应该适合你

 form.addListener('progress' , function(bytesRecieved , bytesExpected){ io.sockets.on('connection', function (socket) { socket.emit('uploadProgress', ((bytesRecieved * 100)/bytesExpected)); }); }); 

在客户端：

 script(src='/socket.io/socket.io.js') // thats jade, but link to the .js anyway you want var socket = io.connect('http://localhost'); socket.on('uploadProgess' , function(percent){ $('#percent').text(percent); });