内容概述

multer是常用的Express文件上传中间件。服务端如何获取文件上传的进度,是使用的过程中,很常见的一个问题。在SF上也有同学问了类似问题《nodejs multer有没有查看文件上传进度的方法?》。稍微回答了下,这里顺便整理出来,有同样疑问的同学可以参考。

下文主要介绍如何利用progress-stream获取文件上传进度,以及该组件使用过程中的注意事项。

利用progress-stream获取文件上传进度

如果只是想在服务端获取上传进度,可以试下如下代码。注意,这个模块跟Express、multer并不是强绑定关系,可以独立使用。

var fs = require('fs');
var express = require('express');
var multer = require('multer');
var progressStream = require('progress-stream'); var app = express();
var upload = multer({ dest: 'upload/' }); app.post('/upload', function (req, res, next) {
// 创建progress stream的实例
var progress = progressStream({length: '0'}); // 注意这里 length 设置为 '0'
req.pipe(progress);
progress.headers = req.headers; // 获取上传文件的真实长度(针对 multipart)
progress.on('length', function nowIKnowMyLength (actualLength) {
console.log('actualLength: %s', actualLength);
progress.setLength(actualLength);
}); // 获取上传进度
progress.on('progress', function (obj) {
console.log('progress: %s', obj.percentage);
}); // 实际上传文件
upload.single('logo')(progress, res, next);
}); app.post('/upload', function (req, res, next) {
res.send({ret_code: '0'});
}); app.get('/form', function(req, res, next){
var form = fs.readFileSync('./form.html', {encoding: 'utf8'});
res.send(form);
}); app.listen(3000);

如何获取上传文件的真实大小

multipart类型,需要监听length来获取文件真实大小。(官方文档里是通过conviction事件,其实是有问题的)

// 获取上传文件的真实长度(针对 multipart)
progress.on('length', function nowIKnowMyLength (actualLength) {
console.log('actualLength: %s', actualLength);
progress.setLength(actualLength);
});

3、关于progress-stream获取真实文件大小的bug?

针对multipart文件上传,progress-stream 实例子初始化时,参数length需要传递非数值类型,不然你获取到的进度要一直是0,最后就直接跳到100。

至于为什么会这样,应该是 progress-steram 模块的bug,看下模块的源码。当length是number类型时,代码直接跳过,因此你length一直被认为是0。

tr.on('pipe', function(stream) {
if (typeof length === 'number') return;
// Support http module
if (stream.readable && !stream.writable && stream.headers) {
return onlength(parseInt(stream.headers['content-length'] || 0));
} // Support streams with a length property
if (typeof stream.length === 'number') {
return onlength(stream.length);
} // Support request module
stream.on('response', function(res) {
if (!res || !res.headers) return;
if (res.headers['content-encoding'] === 'gzip') return;
if (res.headers['content-length']) {
return onlength(parseInt(res.headers['content-length']));
}
});
});

参考链接

https://github.com/expressjs/multer/issues/243

https://github.com/freeall/progress-stream

Node.js:上传文件,服务端如何获取文件上传进度的更多相关文章

  1. Vue上传通过“服务端签名后直传”上传文件到阿里云 报错 400 Bad Request

    我报错的原因是 formData.append('file', file) 放在签名前面了 解决办法 formData.append('file', file) 一定在最后 /** * 上传文件到 o ...

  2. node.js 在 Express4.0 框架使用 Connect-Busboy 实现文件上传

    node.js下四种post提交数据的方式 今天说分享的是其中一种,就是上传文件. Express 4.0 以后,将功能原子化,高内聚,低耦合,独立出了很多中间件 今天主要分享文件上传 对于conne ...

  3. node.js服务端程序在Linux上持久运行

    如果要想在服务端部署node.js程序,让其持久化运行,就不能单单使用npm start命令运行,当然了,这样运行是毫无问题的,但是当关闭xshell窗口或者是关闭进程的时候(其实关闭xshell窗口 ...

  4. C#开发BIMFACE系列4 服务端API之源上传文件

    在注册成为BIMFACE的应用开发者后,要能在浏览器里浏览你的模型或者获取你模型内的BIM数据, 首先需要把你的模型文件上传到BIMFACE.根据不同场景,BIMFACE提供了丰富的文件相关的接口. ...

  5. 服务端php之文件上传

    知识点 echo $_SERVER['PHP_SELF']; 自动获取当前文件的路劲(即提交地址为当前页面) 当一个表单有文件域(即文件上传)的时候,method(提交方式)要设置post,这样更加安 ...

  6. [译]How to Install Node.js on Ubuntu 14.04 如何在ubuntu14.04上安装node.js

    原文链接为 http://www.hostingadvice.com/how-to/install-nodejs-ubuntu-14-04/ 由作者Jacob Nicholson 发表于October ...

  7. 基于node.js 的 websocket的移动端H5直播开发

    这一篇介绍一下基于node.js 的 websocket的移动端H5直播开发, 下载文章底部的源码,我是用vscode打开, 首先在第一个终端运行 npm run http-server 这个指令是运 ...

  8. Socket服务端和客户端文件传输

    很多朋友在使用socket编程时不可避免的都做过文件传输,而视频电影等需要一个字节一个字节的传输:但是客户端一般都通过-1进行终止,服务也一样:但是存在的问题是客户端永远不会把-1传递给服务端:因此经 ...

  9. axios增加自定义headers,页面上出现,服务端收不到

    问题 axios增加自定义headers,页面上出现,服务端收不到 原因 vue-cli起的服务是用node-http-proxy中间件处理的 默认是只有几个常用的header,自定义header是直 ...

随机推荐

  1. [转]python执行bash指令,如果指令返回错误,如何优雅的结束python程序

    如果是有返回值的可执行文件可以直接获取return code, 如果error code 直接退出. import os ret = os.system("COMMAND LINE" ...

  2. Machine Learning - week 4 - 编程练习

    = X' * (h - y) LrCostFunction 与上一周的有什么不同? 与 week3 的 costFunctionReg 是一样的.Week3 中参考答案没有排除 theta 第一行,但 ...

  3. HTML5无刷新修改Url,history pushState/replaceState

    一.认识window.history window.history表示window对象的历史记录,是由用户主动产生,并且接受javascript脚本控制的全局对象.window对象通过history对 ...

  4. Gym100814B Gym100814F Gym100814I(异或) ACM International Collegiate Programming Contest, Egyptian Collegiate Programming Contest (2015) Arab Academy for Science and Technology

    今日份的训练题解,今天写出来的题没有昨天多,可能是因为有些事吧... Gym100814B 这个题就是老师改卷子,忘带标准答案了,但是他改了一部分卷子,并且确定自己改的卷子没出错,他想从改过的卷子里把 ...

  5. Kruskal求最小生成树

    #include<bits/stdc++.h> using namespace std; ; ; const int inf = 0x3f3f3f3f; ; typedef long lo ...

  6. HDU1114Piggy-Bank(完全背包)

    Piggy-Bank Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total ...

  7. MYSQL数据库增量备份

    MySQL数据库增量备份,在这之前修改我们的数据库配置文件/etc/my.cnf开启bin-log日志功能即可.接下来是我参考了下网上的一些方法,自己写的,主要还是要能学到他的一些思路和方法. #fu ...

  8. HDU 2063 过山车(模板—— 二分图最大匹配问题)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=2063  解题思路: 二分图最大匹配模板题. AC代码: #include<stdio.h> ...

  9. Oracle_数据库表的约束

    Oracle_数据库表的约束 完整性约束分类 域完整性约束 (非空not null,检查check) 实体完整性约束 (唯一unique,主键primary key) 参照完整性约束 (外键forei ...

  10. FSFS和VDFS存储方式的区别

    简单来说这个是VisualSVN基于FSFS文件系统格式扩展的.也就是说,分布式版本管理DVCS兴起之后,大家发现多个仓库的好处了,开始给SVN增加这个功能. 至于FSFS本身是SVN在2004年开始 ...