基于nodejs+express(4.x+)实现文件上传功能


Posted in NodeJs onNovember 23, 2015

Nodejs是一个年轻的编程框架,充满了活力和无限激情,一直都在保持着快速更新。基于Nodejs的官方Web开发库Express也在同步发展着,每年升级一个大版本,甚至对框架底层都做了大手术。在Express4时,替换掉中件间库connect,而改用多个更细粒度的库来取代。带来的好处是明显地,这些中间件能更自由的更新和发布,不会受到Express发布周期的影响;但问题也是很的棘手,不兼容于之前的版本,升级就意味着要修改代码。

通过一段时间的查阅资料、摸索,我发现实现上传的方式有:1.express中间件multer模块(此效率最高,在express3.x原生支持,到了express4.x独立成一个模块了),2.connect-multiparty模块(但现在 官方不推荐 ),3.使用multiparty模块实现(此方法比较普遍),4.使用formidable插件实现(插件呢,就是简单易懂);

最简单的做法是通过“connect-multiparty”中间件实现上传。

通过在项目中npm install connect-multiparty进行安装。

用法:

var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();
app.post('/upload', multipartMiddleware, function(req, resp) {
 console.log(req.body, req.files);
 // don't forget to delete all req.files when done 
});

上传后,上传的文件会在临时目录中生成一个临时文件,具体可将req.files打印出查看具体文件路径。

只要在注释的地方将临时文件移动并重命名到实际目录中即可完成上传功能。

简单。

官方地址:https://www.npmjs.com/package/connect-multiparty

但是官方不建议使用该中间件,建议直接使用“multiparty”,因为错误处理比较麻烦。

下面就用“multiparty”实现一个版本。

1.使用express(版本是4.11.x)创建一个项目,采用默认的jade作为模版引擎。

2.在项目目录中,通过npm install multiparty进行安装必要组件。

3.修改views/index.jade,如下做一个简单的用于文件上传的form。

extends layout
  block content                       form(method='post', action='/file/uploading', enctype='multipart/form-data')
    input(name='inputFile', type='file', multiple='mutiple')
    input(name='btnUp', type='submit',value='上传')

 4.修改routes/index.js,实现上传页面和上传响应的后台代码。

var express = require('express');                                                                                                                      
  var router = express.Router();
  var multiparty = require('multiparty');
  var util = require('util');
  var fs = require('fs');
  /* 上传页面 */
  router.get('/', function(req, res, next) {
   res.render('index', { title: 'Express' });
 });
 /* 上传*/
 router.post('/file/uploading', function(req, res, next){
  //生成multiparty对象,并配置上传目标路径
  var form = new multiparty.Form({uploadDir: './public/files/'});
  //上传完成后处理
  form.parse(req, function(err, fields, files) {
   var filesTmp = JSON.stringify(files,null,);
   if(err){
    console.log('parse error: ' + err);
   } else {
    console.log('parse files: ' + filesTmp);
    var inputFile = files.inputFile[];
    var uploadedPath = inputFile.path;
    var dstPath = './public/files/' + inputFile.originalFilename;
    //重命名为真实文件名
    fs.rename(uploadedPath, dstPath, function(err) {
     if(err){
      console.log('rename error: ' + err);
     } else {
      console.log('rename ok');
     }
    });
   }
   res.writeHead(, {'content-type': 'text/plain;charset=utf-'});
   res.write('received upload:\n\n');
   res.end(util.inspect({fields: fields, files: filesTmp}));
  });
 });
 module.exports = router;

完成。基于nodejs+express(4.x+)实现文件上传功能就全部介绍完了,希望对大家学习nodejs express相关知识有所帮助。

NodeJs 相关文章推荐
NodeJS学习笔记之Http模块
Jan 13 NodeJs
Nodejs中的this详解
Mar 26 NodeJs
NodeJS使用formidable实现文件上传
Oct 27 NodeJs
NodeJs测试框架Mocha的安装与使用
Mar 28 NodeJs
理解nodejs的stream和pipe机制的原理和实现
Aug 12 NodeJs
详解使用PM2管理nodejs进程
Oct 24 NodeJs
nodejs结合socket.io实现websocket通信功能的方法
Jan 12 NodeJs
nodejs基于express实现文件上传的方法
Mar 19 NodeJs
详解nodejs通过响应回写的方式渲染页面资源
Apr 07 NodeJs
Nodejs 发布自己的npm包并制作成命令行工具的实例讲解
May 15 NodeJs
Nodejs libuv运行原理详解
Aug 21 NodeJs
Nodejs实现微信分账的示例代码
Jan 19 NodeJs
Nodejs Express4.x开发框架随手笔记
Nov 23 #NodeJs
Nodejs的express使用教程
Nov 23 #NodeJs
nodejs初步体验篇
Nov 23 #NodeJs
Nodejs初级阶段之express
Nov 23 #NodeJs
基于html5和nodejs相结合实现websocket即使通讯
Nov 19 #NodeJs
浅析nodejs实现Websocket的数据接收与发送
Nov 19 #NodeJs
Nodejs实战心得之eventproxy模块控制并发
Oct 27 #NodeJs
You might like
深入了解PHP类Class的概念
2012/06/14 PHP
Zend studio文件注释模板设置方法
2013/09/29 PHP
CodeIgniter框架URL路由总结
2014/09/03 PHP
php中加密解密DES类的简单使用方法示例
2020/03/26 PHP
js loading加载效果实现代码
2009/11/24 Javascript
js的Prototype属性解释及常用方法
2014/05/08 Javascript
javascript中clipboardData对象用法详解
2015/05/13 Javascript
AngularJS使用angular-formly进行表单验证
2015/12/27 Javascript
jQuery实现带水平滑杆的焦点图动画插件
2016/03/08 Javascript
JQuery fileupload插件实现文件上传功能
2016/03/18 Javascript
JS实现控制文本框的内容
2016/07/10 Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
2016/11/01 Javascript
jQuery实现弹窗居中效果类似alert()
2017/02/27 Javascript
Bootstrap栅格系统简单实现代码
2017/03/06 Javascript
JS实现的添加弹出层并完成锁屏操作示例
2017/04/07 Javascript
浅谈MUI框架中加载外部网页或服务器数据的方法
2018/01/31 Javascript
详解Vue微信授权登录前后端分离较为优雅的解决方案
2018/06/29 Javascript
Vue项目部署的实现(阿里云+Nginx代理+PM2)
2019/03/26 Javascript
用Vue.js在浏览器中实现裁剪图像功能
2019/06/18 Javascript
vue监听浏览器原生返回按钮,进行路由转跳操作
2020/09/09 Javascript
python网页请求urllib2模块简单封装代码
2014/02/07 Python
用实例解释Python中的继承和多态的概念
2015/04/27 Python
Python爬虫设置代理IP(图文)
2018/12/23 Python
Python+OpenCV 实现图片无损旋转90°且无黑边
2019/12/12 Python
python使用梯度下降算法实现一个多线性回归
2020/03/24 Python
解决keras模型保存h5文件提示无此目录问题
2020/07/01 Python
python中zip()函数遍历多个列表方法
2021/02/18 Python
python 高阶函数简单介绍
2021/02/19 Python
Under Armour澳大利亚官网:美国知名的高端功能性运动品牌
2018/02/22 全球购物
写好求职信第一句话的技巧
2013/10/26 职场文书
kfc实习自我鉴定
2013/12/14 职场文书
党支部公开承诺践诺书
2014/03/28 职场文书
三八妇女节超市活动方案
2014/08/18 职场文书
公司领导班子对照材料
2014/08/18 职场文书
Nginx域名转发使用场景代码实例
2021/03/31 Servers
elasticSearch-api的具体操作步骤讲解
2021/06/28 Java/Android