multer中间件，可以很方便的结合express处理用户表单上传的文件。

一、安装multer

npm install multer

　　

二、处理单个文件上传

const express = require('express');

const multer = require('multer');

const path = require('path');

let app = express();

app.listen(8888);

app.get('/', function (req, res) {

    res.sendFile(path.join(__dirname, 'index.html'));

});

//创建一个multer对象，dest用来设置上传文件存放的目录

let upload = multer({dest: 'uploads/'});

//single()方法是用来处理单个文件上传，注意参数的名字要与表单中的name值一致

app.post('/upload', upload.single('img'), function (req, res) {

    //body里面存放了表单的文本域信息

    console.log(req.body);

    //file存放了单个文件的信息

    console.log(req.file);

    res.end('ok');

});

index.html的代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>表单</title>

</head>

<body>

<form action="http://localhost:8888/upload" method="post" enctype="multipart/form-data">

    用户名：<input type="text" name="name"><br>

    密码：<input type="password" name="pwd"><br>

    图片：<input type="file" name="img"><br>

    <input type="submit" value="提交">

</form>

</body>

</html>

点击提交后，可以看到在upload目录下有一个文件生成了，这个文件就是我们上传的文件，不过好像扩展名没有了。

二、处理多个文件上传

处理多个文件上传，可以使用 array() 或 fields() 方法。

const express = require('express');

const multer = require('multer');

const path = require('path');

let app = express();

app.listen(8888);

app.get('/', function (req, res) {

    res.sendFile(path.join(__dirname, 'index.html'));

});

let upload = multer({dest: 'uploads/'});

//array()方法用于处理多个文件上传

//参数一表示，文件上传表单name属性的值

//参数二表示，允许上传文件个数

app.post('/uploads', upload.array('imgs', 3), function (req, res) {

    //files存放了多个文件的信息，是一个数组

    console.log(req.files);

    res.end('ok');

});

//fields()方法也可以处理多个文件，参数是一个对象数组。

//对象中用name指定文件上传表单name属性的值，maxCount指定允许上传文件个数

app.post('/objects', upload.fields([

    {name: "head", maxCount: 1},

    {name: "info", maxCount: 3}

]), function (req, res) {

    //files是一个对象，键就是我们上面设置的name的值，值就是文件数组

    console.log(req.files);

    res.end('ok');

});

index.html的代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>表单</title>

</head>

<body>

<form action="http://localhost:8888/uploads" method="post" enctype="multipart/form-data">

    用户名：<input type="text" name="name"><br>

    密码：<input type="password" name="pwd"><br>

    图片1：<input type="file" name="imgs"><br>

    图片2：<input type="file" name="imgs"><br>

    图片3：<input type="file" name="imgs"><br>

    <input type="submit" value="提交">

</form>

<form action="http://localhost:8888/objects" method="post" enctype="multipart/form-data">

    用户名：<input type="text" name="name"><br>

    密码：<input type="password" name="pwd"><br>

    头像：<input type="file" name="head"><br>

    信息1：<input type="file" name="info"><br>

    信息2：<input type="file" name="info"><br>

    <input type="submit" value="提交">

</form>

</body>

</html>

　　

三、自定义文件存储路径和文件名

上面的代码我们通过配置 dest 来指定存放目录。不过如果上传文件过多，单一的存放在一个目录下肯定有问题，所以需要我们自定义。

还有文件上传后，都没有扩展名了，这显然也需要我们自定义。

const express = require('express');

const multer = require('multer');

const path = require('path');

const fs = require('fs');

let app = express();

app.listen(8888);

app.get('/', function (req, res) {

    res.sendFile(path.join(__dirname, 'index.html'));

});

let upload = multer({

    storage: multer.diskStorage({

        //设置文件存储位置

        destination: function (req, file, cb) {

            let date = new Date();

            let year = date.getFullYear();

            let month = (date.getMonth() + 1).toString().padStart(2, '0');

            let day = date.getDate();

            let dir = "./uploads/" + year + month + day;

            //判断目录是否存在，没有则创建

            if (!fs.existsSync(dir)) {

                fs.mkdirSync(dir, {recursive: true});

            }

            //dir就是上传文件存放的目录

            cb(null, dir);

        },

        //设置文件名称

        filename: function (req, file, cb) {

            let fileName = file.fieldname + '-' + Date.now() + path.extname(file.originalname);

            //fileName就是上传文件的文件名

            cb(null, fileName);

        }

    })

});

app.post('/uploads', upload.array('imgs', 3), function (req, res) {

    console.log(req.files);

    res.end('ok');

});

　　

四、过滤上传文件

有些时候我们希望用户上传的只是图片文件，其他文件不让上传。

const express = require('express');

const multer = require('multer');

const path = require('path');

const fs = require('fs');

let app = express();

app.listen(8888);

app.get('/', function (req, res) {

    res.sendFile(path.join(__dirname, 'index.html'));

});

let upload = multer({

    //用于过滤文件的函数

    fileFilter: function (req, file, cb) {

        let ext = path.extname(file.originalname);

        let extArr = ['.jpg', '.jpeg', '.gif', '.png'];

        if (!extArr.includes(ext)) {

            //拒绝这个文件

            //cb(null, false);

            //当然我们还可以发送一个错误

            cb(new Error('扩展名不正确'));

        }

        //接受这个文件

        cb(null, true);

    }

});

app.post('/uploads', upload.array('imgs', 3), function (req, res) {

    console.log(req.files);

    res.end('ok');

});

//捕获错误

app.use(function (err, req, res, next) {

    res.send(err.toString());

});

node.js中 express + multer 处理文件上传的更多相关文章

  1. node.js使用express框架进行文件上传

    关于node.js使用express框架进行文件上传,主要来自于最近对Settings-Sync插件做的研究.目前的研究算是取得的比较好的进展.Settings-Sync中通过快捷键上传文件,其实主要 ...

  2. 使用Node.js的Express框架进行文件上传

    我们先创建一个Express项目,要使用文件上传的功能还需要下载multer模块. npm install --save multer 下面我们在public文件夹下创建upload.html,内容如 ...

  3. Nodejs进阶：基于express+multer的文件上传

    关于作者 程序猿小卡,前腾讯IMWEB团队成员,阿里云栖社区专家博主.欢迎加入 Express前端交流群(197339705). 正在填坑:<Nodejs学习笔记> / <Expre ...

  4. Node.js新手教程——怎样实现文件上传功能

    作者:zhanhailiang 日期:2014-11-16 本文将介绍怎样使用Node.js实现文件上传功能. 1. 初始化项目信息:npm init [root@~/wade/nodejs/node ...

  5. node.js中express模块创建服务器和http模块客户端发请求

    首先下载express模块,命令行输入 npm install express 1.node.js中express模块创建服务端 在js代码同文件位置新建一个文件夹(www_root),里面存放网页文 ...

  6. 在 Node.js 中处理大 JSON 文件

    在 Node.js 中处理大 JSON 文件 场景描述 问题一: 假设现在有一个场景,有一个大的 JSON 文件,需要读取每一条数据经过处理之后输出到一个文件或生成报表数据,怎么能够流式的每次读取一条 ...

  7. Bootstrap fileinput.js，最好用的文件上传组件

    本篇介绍如何使用bootstrap fileinput.js(最好用的文件上传组件)来进行图片的展示,上传,包括springMVC后端文件保存. 一.demo   二.插件引入 <link ty ...

  8. zt对于C#中的FileUpload解决文件上传大小限制的问题设置

    对于C#中的FileUpload解决文件上传大小限制的问题设置 您可能没意识到,但对于可以使用该技术上载的文件的大小存在限制.默认情况下,使用 FileUpload 控件上载到服务器的文件最大为 4M ...

  9. 分享知识-快乐自己：SpringMvc中的单多文件上传及文件下载

    摘要:SpringMvc中的单多文件上传及文件下载:(以下是核心代码(拿过去直接能用)不谢) <!--设置文件上传需要的jar--> <dependency> <grou ...

随机推荐

  1. spotlight工具监控oracle

    spotlight工具版本Version: 5.0.1.1022 安装步骤 安装完成 安装之后,桌面上会生成如下图标 双机此图标,输入License 输入激活码 点击close,再次查看 建立连接,监 ...

  2. Java高级特性 第6节 注解初识

    一.注解概述 Java注解也就是Annotation,是Java代码里的特殊标记,它为Java程序代码提供了一种形式化的方法,用来表达额外的某些信息,这些信息是代码本身无法表示的. 注解以标签的形式存 ...

  3. postgresql jdbc 连接数据库测试

    转载自:http://blog.csdn.net/southflow/article/details/5944107 1. 下载postgresql-8.4-702.jdbc4.jar  2. 点击 ...

  4. 关于APS在企业生产计划上的应用

    本人本身是一个码农,已经服务了共和国各项事业(好像是说得有点漂,没办法段子看多了)大约一半工作时候了(按60岁退休的话),从一线的小码农,到现在成了老农,出产了不少或优或劣的各种码,几乎啥都做过.近几 ...

  5. linux命令行命令

    Linux命令行编辑快捷键: history 显示命令历史列表 ↑(Ctrl+p) 显示上一条命令 ↓(Ctrl+n) 显示下一条命令 !num 执行命令历史列表的第num条命令 !! 执行上一条命令 ...

  6. SpringMVC复习

    第一天 springmvc.xml 一个配置文件,SpringMVC本身就是Spring的子项目,对Spring兼容性很好,不需要做很多配置. 这里只配置一个Controller扫描就可以了,让Spr ...

  7. Python中Lambda表达式使用

    软件环境 Python: 2.7.13; win10 Lambda描述 python 使用 lambda 表达式来创建匿名函数 lambda只是一个表达式,函数体比def简单很多 lambda的主体是 ...

  8. Pyspider框架

    1, 2,在ubuntu安装pyspider如果出现pycul的问题 首先执行命令:sudo apt-get install libssl-dev libcurl4-openssl-dev pytho ...

  9. Ext.NET Grid Group分组使用

    - 需要注意的是, 涉及到分页排序, 最好定义GroupDir 方向与分组方式相同. - 譬如工资表按照最新最前分页输出. 如果分组按照默认排序的话, 最就最前. - 界面呈现出2015年, 2016 ...

  10. canal 结合 kafka 入门

    1.kafka的安装: 略 2.cannal  配置 使用卡夫卡: 修改  /home/admin/canal-server/conf/canal.properties 2.1 修改canal.ser ...