Cách kết nối tệp tải lên đáng gờm lên socket.io trong Node.js

Question

Tôi là người mới bắt đầu nút và tôi đang cố gắng thiết lập tải lên hình ảnh đa dạng thông qua ghê gớm sẽ có thanh tiến trình và cũng gọi lại sau mỗi lần tải lên sẽ tự động tải tất cả các hình ảnh vào cùng một trang sau khi chúng được tải lên xong. Tôi hiểu rằng tôi cần sử dụng socket.io để tương tác lại với trình duyệt sau khi quá trình tải lên bắt đầu. Formidable có một người nghe sự kiện cho "tiến bộ". Tôi cần kịch bản phía máy khách của tôi để nhận các byte nhận được để tạo thanh tải lên. Sau khi tệp được tải lên xong, tôi muốn socket.io chuyển cho máy khách địa chỉ url của hình ảnh được tải lên để khách hàng có thể tải hình ảnh và gắn nó vào DOM động. Đây là mã tôi có cho đến nay.

Câu hỏi của tôi là làm cách nào để cấu trúc mã socket.io bên trong trình xử lý sự kiện cho "tiến trình" để nó có thể phát tới máy khách?

Dưới đây là một số mã giả lỏng lẻo để cho bạn thấy những gì tôi đang nói về:

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

này nên làm việc cho bạn

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

và trên các mặt hàng:

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

Tôi đã sử dụng phiên bản v1.0.14 và socket.io 1.0.0 trước.

Khi khách hàng gửi yêu cầu kết nối sẽ được thực hiện và máy chủ sẽ tạo phòng cho khách hàng này dựa trên id phiên của mình chẳng hạn.

Sau đó trong sự kiện tiến độ, chúng tôi sẽ phát phần trăm cho một khách hàng trong phòng.

đây bạn có thể tìm thêm thông tin về phòng: https://github.com/LearnBoost/socket.io/wiki/Rooms

server app.js (main, khi khởi động):

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

server POST:

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

Chủ đầu tư:

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

Khi bạn muốn làm việc với các phiên, điều này có thể hữu ích: http://www.danielbaulig.de/socket-ioexpress/#comment-11315