节点强大和简单的进度条

如果我看看节点强大的文档,我可以阅读:

"Event: 'progress' (bytesReceived, bytesExpected) Emitted after each incoming chunk of data that has been parsed. Can be used to roll your own progress bar." 

我想知道如何实现我自己的进度条我的意思是如何读取信息客户端? 我很困惑。 它是否在POST开始之后启动的轮询GET实现,或者在上传时是否可以从POST请求中读取信息?

如果我看看这个:

 http.createServer(function(req, res) { if (req.url == '/upload' && req.method.toLowerCase() == 'post') { // parse a file upload var form = new formidable.IncomingForm(); form.parse(req, function(err, fields, files) { res.writeHead(200, {'content-type': 'text/plain'}); res.write('received upload:\n\n'); res.end(sys.inspect({fields: fields, files: files})); }); return; } 

看起来像/ upload url正在处理POST请求并返回一些res.write('received upload:\ n \ n');

我的问题是谁可以阅读

 res.write('received upload:\n\n'); 

你不需要重写onPart钩子!

只需在每个窗体progress事件callback调用中通过套接字广播消息,如下所示:

 form.on('progress', function(bytesReceived, bytesExpected) { var progress = { type: 'progress', bytesReceived: bytesReceived, bytesExpected: bytesExpected }; socket.broadcast(JSON.stringify(progress)); }); 

比在客户端侦听套接字消息。

一个很好的select可以使用socket.io

请记住覆盖onPart钩子。

 incomingForm.onPart = function(part) { part.addListener('data', function() { // send back to the client the status }); } 

xhr.upload.onprogress说,你正在通过AJAX上传东西,那么你只需要在客户端绑定一个callback到xhr.upload.onprogress

 xhr.upload.onprogress = (e) => { if (e.lengthComputable) { console.log(`${e.loaded} out of ${e.total} bytes have been uploaded`) } } 

没有要求在服务器端。 看到这里的注射点的完整列表。 和教程在这里 。