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

前端技术 2023/09/02 JavaScript

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相关知识有所帮助。

本文地址:https://www.stayed.cn/item/4397

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。