基于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教程 安装express及配置app.js文件的详细步骤
May 11 NodeJs
跟我学Nodejs(一)--- Node.js简介及安装开发环境
May 20 NodeJs
nodejs事件的监听与触发的理解分析
Feb 12 NodeJs
NodeJS连接MongoDB数据库时报错的快速解决方法
May 13 NodeJs
nodejs redis 发布订阅机制封装实现方法及实例代码
Dec 15 NodeJs
详谈Angular路由与Nodejs路由的区别
Mar 05 NodeJs
使用 NodeJS+Express 开发服务端的简单介绍
Apr 07 NodeJs
解析NodeJS异步I/O的实现
Apr 13 NodeJs
nodejs实现大文件(在线视频)的读取
Oct 16 NodeJs
nodeJS微信分享
Dec 20 NodeJs
nodejs aes 加解密实例
Oct 10 NodeJs
NodeJs 实现简单WebSocket即时通讯的示例代码
Aug 05 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 数组遍历顺序理解
2009/09/09 PHP
PHP代码优化的53个细节
2014/03/03 PHP
ThinkPHP之foreach标签使用概述
2014/06/30 PHP
深入探究PHP的多进程编程方法
2015/08/18 PHP
PHPExcel在linux环境下导出报500错误的解决方法
2017/01/26 PHP
Javascript学习笔记7 原型链的原理
2010/01/11 Javascript
纯JavaScript实现的完美渐变弹出层效果代码
2010/04/02 Javascript
Dom与浏览器兼容性说明
2010/10/25 Javascript
Prototype框架详解
2015/11/25 Javascript
原生js实现图片轮播特效
2015/12/18 Javascript
JS插件overlib用法实例详解
2015/12/26 Javascript
浅谈bootstrap源码分析之tab(选项卡)
2016/06/06 Javascript
jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍
2016/09/01 Javascript
滚动条的监听与内容随着滚动条动态加载的实现
2017/02/08 Javascript
jQuery中用on绑定事件时需注意的事项
2017/03/19 Javascript
JavaScript实现实时更新系统时间的实例代码
2017/04/04 Javascript
Vue 中的compile操作方法
2018/02/26 Javascript
浅谈Angular7 项目开发总结
2018/12/19 Javascript
使用vue2.6实现抖音【时间轮盘】屏保效果附源码
2019/04/24 Javascript
Vue scoped及deep使用方法解析
2020/08/01 Javascript
详解vue 组件的实现原理
2020/11/12 Javascript
Python编程判断一个正整数是否为素数的方法
2017/04/14 Python
Python三级菜单的实例
2017/09/13 Python
在Python中输入一个以空格为间隔的数组方法
2018/11/13 Python
Django-Model数据库操作(增删改查、连表结构)详解
2019/07/17 Python
python 6.7 编写printTable()函数表格打印(完整代码)
2020/03/25 Python
纯CSS3实现手风琴风格菜单具体步骤
2013/05/06 HTML / CSS
英国太阳镜品牌:Taylor Morris Eyewear
2018/04/18 全球购物
美国现代家具购物网站:LexMod
2019/01/09 全球购物
常用UNIX 命令(Linux的常用命令)
2013/07/10 面试题
留学推荐信范文
2014/05/10 职场文书
银行求职自荐书
2014/06/25 职场文书
教师群众路线剖析材料
2014/09/29 职场文书
《将心比心》教学反思
2016/02/23 职场文书
详细聊聊vue中组件的props属性
2021/11/02 Vue.js
Hive导入csv文件示例
2022/06/25 数据库