Node.js上传文件功能之服务端如何获取文件上传进度

内容概述

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

总结

以上所述是小编给大家介绍的Node.js上传文件功能之服务端如何获取文件上传进度,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

您可能感兴趣的文章:

  • NodeJS使用七牛云存储上传文件的方法
  • nodejs 实现模拟form表单上传文件
(0)

相关推荐

  • nodejs 实现模拟form表单上传文件

    以前项目里有这个方法,最近在客户那里出问题了,同事说,这个方法从来就没管用过,SO,用了一天时间把这个方法给搞出来了(觉得花费的时间长了点),分享之. 代码及测试用例: var http = require('http'); var path = require('path'); var fs = require('fs'); function postFile(fileKeyValue, req) { var boundaryKey = Math.random().toString(16);

  • NodeJS使用七牛云存储上传文件的方法

    1-准备工作 确认安装node和npm 安装 qiniu,formidable,express模块 npm install --save qiniu formidable [x] 导入模块 let qiniu = require('qiniu'), formidable = require('formidable'), express = require('express'), router = express.Router(); 2-服务器端的云存储操作 2-1文件上传 router.post

  • Node.js上传文件功能之服务端如何获取文件上传进度

    内容概述 multer是常用的Express文件上传中间件.服务端如何获取文件上传的进度,是使用的过程中,很常见的一个问题.在SF上也有同学问了类似问题<nodejs multer有没有查看文件上传进度的方法?>.稍微回答了下,这里顺便整理出来,有同样疑问的同学可以参考. 下文主要介绍如何利用progress-stream获取文件上传进度,以及该组件使用过程中的注意事项. 利用progress-stream获取文件上传进度 如果只是想在服务端获取上传进度,可以试下如下代码.注意,这个模块跟Ex

  • ASP.NET Core单文件和多文件上传并保存到服务端的方法

    前言: 在我们日常开发中,关于图片,视频,音频,文档等相关文件上传并保存到服务端中是非常常见的一个功能,今天主要是把自己在开发中常用的两种方式记录下来方便一下直接使用,并且希望能够帮助到有需要的同学! 一.配置ASP.NET Core中的静态文件: 简单概述: 在ASP.NET Core应用中静态资源文件需要进行相应的配置才能够提供给客户端直接使用. 详情描述请参考官方文档: https://docs.microsoft.com/zh-cn/aspnet/core/fundamentals/st

  • Node.js+jade抓取博客所有文章生成静态html文件的实例

    这篇文章,我们就把上文中采集到的所有文章列表的信息整理一下,开始采集文章并且生成静态html文件了.先看下我的采集效果,我的博客目前77篇文章,1分钟不到就全部采集生成完毕了,这里我截了部分的图片,文件名用文章的id生成的,生成的文章,我写了一个简单的静态模板,所有的文章都是根据这个模板生成的. 项目结构: 好了,接下来,我们就来讲解下,这篇文章主要实现的功能: 1,抓取文章,主要抓取文章的标题,内容,超链接,文章id(用于生成静态html文件) 2,根据jade模板生成html文件 一.抓取文

  • node.js +mongdb实现登录功能

    一.开发环境准备 npm init -y //初始化仓库 npm i koa koa-router -S //安装koa和路由模块 npm i nodemon -S 二.开启node服务 //index.js const koa = require("koa"); const router = require("koa-router")(); const app = new koa(); router.get("/",async ctx=>

  • 利用Node.JS实现邮件发送功能

    第一步.配置篇 首先需要安装nodemailer库 npm install nodemailer//默认会安装最新的版本. 关于这个库的文档参见nodemailer 第二步.库的一些使用介绍 这个库使用方法很简单的.首先是要创建一个用于发送邮件的实例 var transporter = nodemailer.createTransport(transport[, defaults]) transport参数属性 属性太多了就只写一些关键的属性 port:连接的端口号,一般就是465 host:你

  • Linux使用Node.js建立访问静态网页的服务实例详解

    Linux使用Node.js建立访问静态网页的服务实例详解 一.安装node.js运行所需要的环境,:http://www.jb51.net/article/79536.htm 二.创建node目录(/node/www),并在目录下创建node.js服务文件server.js var http = require('http'); var fs = require('fs');//引入文件读取模块 var documentRoot = '/node/www';//需要访问的文件的存放目录 var

  • node.js+express留言板功能实现示例

    目录 留言板 所需类库 开源项目 项目结构 留言板 基于nodejs+express+art-template的留言板功能.包含列表界面.添加界面和发送留言功能. 所需类库 直接copy以下package.json 然后直接 npm install 或者yarn install 即可. package.json所需内容如下. { "name": "nodejs_message_board", "version": "2021.09&qu

  • Node.js实现登录注册功能

    本文实例为大家分享了Node.js实现登录注册功能的具体代码,供大家参考,具体内容如下 目录结构 注册页面: reg.html <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial

  • 阿里云OSS实践文件直传基于服务端

    目录 前言 优缺点 流程 逻辑拆解 代码实现 OSS 配置 policy 内容 有效期 文件名 转化 policy 进一步分析 完整代码 前言 在日常开发中,客户端上传文件的一般流程是:客户端向服务端发送文件,再由服务端将文件转储到专门的存储服务器或云计算厂商的储存服务(例如阿里云 OSS)上,这样做的一个弊端是上传环节占用服务器的带宽,个位数的并发上传就能把带宽占满,从而导致用户体验下降.而如果直接将文件从客户端直传到第三方的存储服务上,就可以避免这个问题. ​ 本文以阿里云 OSS(Obje

  • IDEA利用自带Axis工具和wsdl文件反向生成服务端客户端代码详细流程

    推荐教程 idea2021以下最新安装j ihuo 教程 https://www.jb51.net/article/184631.htm https://www.jb51.net/article/178193.htm 正文 IDEA,我使用的是最新版本(2021.1.1) JDK1.8 tomcat-8 详细步骤,用图片代替,关键地方,字幕解释. 到此步骤,是关键重点,请认真看 鼠标右键选择项目(soap-demo)然后请看图片 当改完之后,项目结构,会发生改变 创建-服务端-生成代码 1.请提

随机推荐