Nodejs实现文件上传的示例代码


Posted in NodeJs onSeptember 26, 2017

笔者用nodejs做项目时需要用到文件上传的功能,在网上搜索了很多教程,找到了一个express的中间件,用于处理 multipart/form-data 类型的表单数据,可以很方便的将表单中的文件数据保存到服务器。

介绍

简单的用法

定义存储器

Multer作为express的一个中间件,我们可以很方便的自定义上传的文件目录以及保存的文件名。先看一个最简单的用法, demo1地址 :

var express = require('express');
var multer = require('multer');
var app = express();

var upload = multer({
  storage: multer.diskStorage({
    destination: function (req, file, cb){
      cb(null, './uploads/');
    },
    filename: function (req, file, cb){
      //file.originalname上传文件的原始文件名
      var changedName = (new Date().getTime())+'-'+file.originalname;
      cb(null, changedName);
    }
  })
});

我们先创建了一个upload对象,这个对象中destination函数用来定义上传文件的存储的文件夹;filename函数用来修改上传文件存储到服务器的文件名称,这里我们我们加上一个时间戳简单区分一下。这两个函数都是通过回调函数来实现的。每次上传的时候这两个函数都会调用一次,如果是多个文件上传,那个这两个函数就调用多次,调用顺序是先调用destination,然后调用filename。

在两个函数中都会有一个 file 对象,表示当前上传的文件对象,有以下几个属性:

  • fieldname:上传的字段名
  • originalname:上传的文件名
  • encoding:文件的编码类型
  • mimetype:文件的MIME类型

定义路由回调

//单个文件上传
app.post('/upload/single',upload.single('singleFile'),(req,res)=>{
  console.log(req.file);
  res.json({
    code: '0000',
    type:'single',
    originalname: req.file.originalname
  })
});

//多个文件上传
app.post('/upload/multer',upload.array('multerFile'),(req,res)=>{
  console.log(req.files);
  let fileList = [];
  req.files.map((elem)=>{
    fileList.push({
      originalname: elem.originalname
    })
  });
  res.json({
    code: '0000',
    type:'multer',
    fileList:fileList
  });
});

在express中定义路由的回调函数时,把定义好了的upload对象作为中间件添加进去。如果是单个文件就用 single 方法,如果是多个文件就用 array 方法,这两个方法都需要传一个页面上定义好的字段名。

在路由的回调函数中,request对象已经有了file属性(单个文件上传)或files属性(多个文件上传),files属性是一个数组,数组的每一个对象都有以下属性:

  • fieldname:上传的字段名
  • originalname:上传的文件名
  • encoding:文件的编码类型
  • mimetype:文件的MIME类型
  • destination:存储的目录(和destination回调函数中的目录名一致)
  • filename:保存的文件名(和filename回调函数中的文件名一致)
  • path:保存的相对路径
  • size:文件的大小(单位:字节byte)

我们可以发现在路由的回调函数中的file对象比diskStorage中的file对象多了几个属性,这是因为在diskStorage中文件还没有保存,只能知道文件的大致属性;而路由的回调函数文件已经在服务器上保存好了,文件的保存路径以及文件的大小都是已知的。

过滤文件上传

在文件上传时,有时候会上传一些我们不需要的文件类型,我们需要把一些不需要的文件给过滤掉。demo2地址 。

文件类型过滤

var upload = multer({
  //...其他代码
  fileFilter: function(req, file, cb){
    if(file.mimetype == 'image/png'){
      cb(null, true)
    } else {
      cb(null, false)
    }
  }
});

在定义存储器的时候,新增一个fileFilter函数,用来过滤掉我们不需要的文件,在回调函数中我们传入true/false来代表是否要保存;如果传了false,那么destination函数和filename函数也不会调用了。

文件大小和数量过滤

var upload = multer({
  //...其他代码
  limits:{
    //限制文件大小10kb
    fileSize: 10*1000,
    //限制文件数量
    files: 5
  }
});

在定义存储器的时候,新增一个limits对象,用来控制上传的一些信息,它有以下一些属性:

  • fieldNameSize:field 名字最大长度,默认值:100 bytes
  • fieldSize:field 值的最大长度,默认值:1MB
  • fields:非文件 field 的最大数量
  • fileSize:在multipart表单中, 文件最大长度 (字节单位)
  • files:在multipart表单中, 文件最大数量
  • parts:在multipart表单中, part传输的最大数量(fields + files)

在这边我们把fileSize的值设置得小一点,设为10kb方便测试看效果,但是如果这个时候会发现有报错。因为上传的文件大小很容易就会超过10KB,导致有报错出现,我们就需要在路由回调里对错误的情况进行捕获。

//单个文件上传
let singleUpload = upload.single('singleFile');
app.post('/upload/single',(req,res)=>{
  singleUpload(req,res,(err)=>{
    if(!!err){
      console.log(err.message)
      res.json({
        code: '2000',
        type:'single',
        originalname: '',
        msg: err.message
      })
      return;
    }
    if(!!req.file){
      res.json({
        code: '0000',
        type:'single',
        originalname: req.file.originalname,
        msg: ''
      })
    } else {
      res.json({
        code: '1000',
        type:'single',
        originalname: '',
        msg: ''
      })
    }
  });
});

//多个文件上传
let multerUpload = upload.array('multerFile');
app.post('/upload/multer', (req,res)=>{
  multerUpload(req,res,(err)=>{
    if(!!err){
      res.json({
        code: '2000',
        type:'multer',
        fileList:[],
        msg: err.message
      });
    }
    let fileList = [];
    req.files.map((elem)=>{
      fileList.push({
        originalname: elem.originalname
      })
    });
    res.json({
      code: '0000',
      type:'multer',
      fileList:fileList,
      msg:''
    });
  });
});

所有的demo代码都在这个 仓库里

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
跟我学Nodejs(二)--- Node.js事件模块
May 21 NodeJs
nodejs npm package.json中文文档
Sep 04 NodeJs
轻松创建nodejs服务器(7):阻塞操作的实现
Dec 18 NodeJs
Express与NodeJs创建服务器的两种方法
Feb 06 NodeJs
Nodejs+angularjs结合multiparty实现多图片上传的示例代码
Sep 29 NodeJs
基于nodejs的雪碧图制作工具的示例代码
Nov 05 NodeJs
NodeJs实现简单的爬虫功能案例分析
Dec 05 NodeJs
Nodejs中怎么实现函数的串行执行
Mar 02 NodeJs
Nodejs中的require函数的具体使用方法
Apr 02 NodeJs
纯异步nodejs文件夹(目录)复制功能
Sep 03 NodeJs
nodeJS与MySQL实现分页数据以及倒序数据
Jun 05 NodeJs
一文秒懂nodejs中的异步编程
Jan 28 NodeJs
详解nodejs通过代理(proxy)发送http请求(request)
Sep 22 #NodeJs
使用vs code开发Nodejs程序的使用方法
Sep 21 #NodeJs
详解使用vscode+es6写nodejs服务端调试配置
Sep 21 #NodeJs
在Debian(Raspberry Pi)树莓派上安装NodeJS的教程详解
Sep 19 #NodeJs
Nodejs中使用phantom将html转为pdf或图片格式的方法
Sep 18 #NodeJs
nodejs Assert中equal(),strictEqual(),deepEqual(),strictDeepEqual()比较
Sep 18 #NodeJs
Nodejs+express+ejs简单使用实例代码
Sep 18 #NodeJs
You might like
php Http_Template_IT类库进行模板替换
2009/03/19 PHP
PHP对字符串的递增运算分析
2010/08/08 PHP
php循环语句 for()与foreach()用法区别介绍
2012/09/05 PHP
域名和cookie问题(域名后缀)
2012/10/10 PHP
codeigniter数据库操作函数汇总
2014/06/12 PHP
[原创]php实现子字符串位置相互对调互换的方法
2016/06/02 PHP
Zend Framework分发器用法示例
2016/12/11 PHP
javascript 写的一个简单的timer
2009/07/30 Javascript
JavaScript 获取用户客户端操作系统版本
2009/08/25 Javascript
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
2011/04/07 Javascript
基于JQuery 的消息提示框效果代码
2011/07/31 Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
2013/08/02 Javascript
jQuery消息提示框插件Tipso
2015/05/04 Javascript
javascript处理a标签超链接默认事件的方法
2015/06/29 Javascript
AJAX和jQuery动态加载数据的实现方法
2016/12/05 Javascript
vue2笔记 — vue-router路由懒加载的实现
2017/03/03 Javascript
Vue计算属性的学习笔记
2017/03/22 Javascript
微信小程序 侧滑删除(左滑删除)
2017/05/23 Javascript
JS验证码实现代码
2017/09/14 Javascript
js计算两个日期间的天数月的实例代码
2018/09/20 Javascript
微信小程序实现动态显示和隐藏某个控件功能示例
2018/12/14 Javascript
详解vue的双向绑定原理及实现
2019/05/05 Javascript
jQuery AJAX应用实例总结
2020/05/19 jQuery
python爬取淘宝商品销量信息
2018/11/16 Python
Python Unittest根据不同测试环境跳过用例的方法
2018/12/16 Python
Django框架ORM数据库操作实例详解
2019/11/07 Python
CSS3实现swap交换动画
2016/01/19 HTML / CSS
意大利简约的休闲品牌:Aspesi
2018/02/08 全球购物
秘书行业自我鉴定范文
2013/12/30 职场文书
社区敬老月活动实施方案
2014/02/17 职场文书
行政人事岗位职责
2014/03/17 职场文书
优秀大专毕业生求职信
2014/08/04 职场文书
邀请书格式范文
2015/02/02 职场文书
面试通知邮件
2015/04/20 职场文书
百年孤独读书笔记
2015/06/29 职场文书
公司借款担保书
2015/09/22 职场文书