我使用Socket.io上传文件.它适用于以下架构:
客户端:从输入读取文件并将其编码为Base64并压缩它
客户端:发送Socket.io事件"上传",包括压缩文件作为一段数据
服务器:收听"上传"事件,解压缩并解码文件并保存
大文件出现问题:我无法看到通过客户端发送的数据进度(就像我使用XHR一样).
要解决这些问题,我必须跟踪(检查)上传事件的上传进度.我怎样才能做到这一点?
我想在CLIENT SIDE上只收听上传进度
感谢bnuhero,socketio-file-upload有可能在服务器端收听进度,并在我们说每上传5%或20%时向客户端发送消息.所以它意味着每个文件分别发送20或5条消息.我想听取客户方面的进展.
看起来没有可能用裸Socket.io检查客户端的进度.Io-stream解决了这个问题.
客户:
var chunk_size = 100; var compressed_data = 'some-long-string'; var reg = new RegExp('/.{1,'+chunk_size+'}/g'); var parts = compressed_data .match(reg); var l = parts.length -1; client.socket.emit('data', parts.pop()); client.socket.on('received', function () { client.socket.emit('data', [l - parts.lengt, parts.pop()]); });
服务器:
sockets.on('connection', function (socket) { var parts = []; socket.on('data', function (data) { if (data[1] === undefined) { fs.writeFile(parts.join(''), callback...); } else { parts[data[0]] = data[1]; socket.emit('received'); } }); });
如果这仍然无法工作,您可以在服务器和客户端之间添加协商服务器响应"已接收"事件,并且客户端在收到"已接收"事件时发送下一个块
这允许您的服务器限制客户端的速度,但是这应该已经通过您使用的套接字库工作
包括反馈和消息顺序
我想我误解了你的问题
但要解决这个问题,因为我现在理解它,例如有一个关于何时为每个部分冲洗缓冲区的指示,它有两个选项,要么仍然模拟该行为,要么接受服务器接受的块并将其用作每个部分的大小.
后者是实际的进展所以我给出了一个例子(如果服务器接受1Mb的块,文件是1Mb,它仍然会在一步中从0变为100.
https://github.com/nkzawa/socket.io-stream
服务器示例就是github页面上显示的内容
客户端:
var io = require('socket.io-client'); var ss = require('socket.io-stream'); var socket = io.connect('http://example.com/user'); var stream = ss.createStream(); var filename = 'profile.jpg'; var through = require('through'); var compressed_data = 'some-long-string'; var l = compressed_data .length; var total_progress = 0; //pass the stream trough throug, giving feedback for each chunk passed var tr = through(function (chunk) { total_progress += chunk.toString().length; client.socket.emit('progress', l, total_progress); this.queue(chunk) }, function () { client.socket.emit('progress', l, l); }) //use the streaming version of socket.io ss(socket).emit('profile-image', stream, {name: filename}); //get a stream for the compressed_data //filter it trough tr for the progress indication //and pass it to the socket stream fs.createReadStream(compressed_data ).pipe(tr).pipe(stream);
流有一个退避机制,服务器接受流缓冲区的每个块,如果服务器减慢流量以较低的速率读取,给你更多的进展