Cómo conectar formidable carga de archivos a socket.io en Node.js

Question

Soy nodo principiante y estoy tratando de configurar una carga de imágenes de múltiples archivos formidable que tendrá una barra de progreso y también una devolución de llamada después de cada carga que dinámicamente cargue todas las imágenes en la misma página una vez que se hayan cargado. Entiendo que necesito usar socket.io para interactuar de nuevo con el navegador después de que la carga haya comenzado. Formidable tiene un oyente de eventos para "progreso". Necesito mi script del lado del cliente para recibir los bytes recibidos para crear una barra de carga. Después de que el archivo termine de cargarse, quiero que socket.io pase al cliente la url de donde se cargó la imagen para que el cliente pueda cargar la imagen y anexarla al DOM de forma dinámica. Aquí está el código que tengo hasta ahora.

Mi pregunta es ¿cómo estructurar el código socket.io dentro del detector de eventos para el "progreso" para que pueda transmitir al cliente?

Aquí es un poco de pseudo-código sueltos para mostrar lo que estoy hablando:

//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

esto debería funcionar para usted

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

y en el lado del cliente:

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); 
}); 

Answer 2

Utilicé Nodo-formidable v1.0.14 y socket.io 1.0.0-pre.

Cuando los clientes envían una solicitud se establecerá una conexión y el servidor creará una habitación para este cliente en función de su ID de sesión, por ejemplo.

A continuación, en el evento de progreso transmitiremos el porcentaje a un cliente en la habitación.

Aquí puede encontrar más información acerca de las habitaciones: https://github.com/LearnBoost/socket.io/wiki/Rooms

app.js Server (principal, en el arranque):

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

servidor POST:

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

Cliente:

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

Cuando desee trabajar con sesiones, esto podría ayudar: http://www.danielbaulig.de/socket-ioexpress/#comment-11315