Skip to content

node.js 在 Express4.0 框架使用 Connect-Busboy 实现文件上传

--> -->

  • 文章目录

    • Express 4.0 以后,将功能原子化,高内聚,低耦合,独立出了很多中间件

    • 安装

    • 使用

    • Connect-Busboy 中间件实现上传

    • install

    • 使用

    • 上传文件处

    • 说明

    • req.busboy.on('file', function (fieldname, file, filename, encoding, mimetype)

      • 如果你的文件是直接存放在服务器指定目录,那么完全没必要指定临时目录,再去拷贝,直接一步到位,存放在指定上面目录即可
      • 我之所以用这种方法,是因为我的图片文件全部保存在数据库中
      • 如果此上传方法的入口开放给用户,请注意根据 filename 后缀名 及 mimetype 来判断文件类型,进行过滤
  • node.js下四种post提交数据的方式

今天说分享的是其中一种,就是上传文件.

  • Express 4.0 以后,将功能原子化,高内聚,低耦合,独立出了很多中间件

  • 今天主要分享文件上传

对于connect-multiparty ,他是专门处理此类post数据相关的依赖包,也是博客之前使用的方式
github 官方地址: https://github.com/andrewrk/connect-multiparty

安装

npm install connect-multiparty

使用

var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();

app.post('/formdata',multipartMiddleware, function (req, res) {
 console.log(req.body);
 res.send(req.body);
});

注意

  • form标签里做这样的标识 enctype="multipart/form-data"

Connect-Busboy 中间件实现上传

github官方地址:https://github.com/mscdex/connect-busboy

install

npm install connect-busboy

使用

node.js 启动页
var busboy = require('connect-busboy');

中间件配置

app.use(busboy({
    limits: {
        fileSize: 10 * 1024 * 1024 // 10MB
    }
}));

上传文件处

这里的代码有点bug ,已经修复,你可以忽略,直接看我的另外一篇博客 Connect-Busboy 上传文件

function upload(req, res, next) {
    req.busboy.on('file', function (fieldname, file, filename, encoding, mimetype) {
        var tmp_path=path.join(os.tmpDir(), path.basename(filename));
        file.pipe(fs.createWriteStream(tmp_path));
        file.on('end',function(){
            var uuid = tool.generateUUID();
            commfile.savePathFile(uuid, mimetype, tmp_path, true, function(err, fileBase64) {
                if (err) {
                    res.json({
                        success:false,
                        url:''
                    });
                }else{
                    res.json({
                        success: true,
                        url: '/file/' + uuid
                    });
                }
            });
        });
    });

    req.pipe(req.busboy);
    }

说明 >> req.busboy 会监听几个事件 * req.busboy.on('file',function(fieldname, file, filename, encoding, mimetype){ .....} 上传文件时监听此事件 * req.busboy.on('field',function(key, value, keyTruncated, valueTruncated){ .... } 监听form表单中非文件类型其他参数

上面的上传示例只用到了处理文件类型的字段,没有涉及到非文件类型的字段.所以只监听了 file 事件.

req.busboy.on('file', function (fieldname, file, filename, encoding, mimetype)

上面的事件会在 enctype="multipart/form-data" 的 form 表单post 提交数据时被监听

function(fieldname, file, filename, encoding, mimetype) 回调函数中是服务器获取到的文件相关处理信息
fieldname 是一个上传文件的标识
file 是上传的文件流句柄
filenname 是文件名(包含扩展名)
encoding 是文件编码类型
mimetype 是文件mime类型
var tmp_path=path.join(os.tmpDir(), path.basename(filename));
根据系统临时目录 和 文件名,来定位文件临时存放路径

  • os.tmpDir() 是当前系统临时目录,需要引用 require('os');
    path.basename(filename) 是提取filename 路径中最后一个 / 之后的文件名,比如 /aa/bb/cc.jpg 此方法最后得到的是 cc.jpg ,需 require('path')

  • file.pipe(fs.createWriteStream(tmp_path));

根据上面的临时文件目录,把上传文件临时保存起来 ,这里用到了 流 的 pipe 它就像一个水管子能源源不断的把字节流传递给文件流,直到文件被写入成功为止
file.on('end',function(){ ....} 此事件是在 文件 被写入完成时触发的事件.
当文件被写入临时目录成功后,马上触发上面的事件,我在这里 调用 commfile.savePathFile 方法把文件读取并写入到了数据库

如果你的文件是直接存放在服务器指定目录,那么完全没必要指定临时目录,再去拷贝,直接一步到位,存放在指定上面目录即可

我之所以用这种方法,是因为我的图片文件全部保存在数据库中

如果此上传方法的入口开放给用户,请注意根据 filename 后缀名 及 mimetype 来判断文件类型,进行过滤

  • 安装
  • 使用
  • Connect-Busboy 中间件实现上传
  • install
  • 使用
  • 上传文件处
  • 说明
  • req.busboy.on('file', function (fieldname, file, filename, encoding, mimetype)
    • 如果你的文件是直接存放在服务器指定目录,那么完全没必要指定临时目录,再去拷贝,直接一步到位,存放在指定上面目录即可
    • 我之所以用这种方法,是因为我的图片文件全部保存在数据库中
    • 如果此上传方法的入口开放给用户,请注意根据 filename 后缀名 及 mimetype 来判断文件类型,进行过滤