Die Nodejs+Express-Middleware implementiert den Datei-Upload

Dieser Artikel gibt Ihnen eine detaillierte Einführung in die Nodejs-Methode zum Datei-Upload. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Der Autor muss die Datei-Upload-Funktion verwenden, wenn er Projekte mit nodejs durchsucht. Ich habe viele Tutorials im Internet durchsucht und eine Express-Middleware für die Verarbeitung des Typs multipart/form-data gefunden Formulardaten können die Dateidaten im Formular problemlos auf dem Server speichern. multipart/form-data类型的表单数据，可以很方便的将表单中的文件数据保存到服务器。

介绍

---

multer是一个node.js文件上传中间件，它是在 busboy的基础上开发的，上传的表单数据必须是multipart/form-data类型，不然会报错。【相关推荐：《nodejs 教程》】 　　

简单的用法

---

定义存储器

Multer作为express的一个中间件，我们可以很方便的自定义上传的文件目录以及保存的文件名。先看一个最简单的用法，demo1地址：

var express = require('express');
var multer = require('multer');
var app = express();

var upload = multer({
    storage: multer.diskStorage({
        destination: function (req, file, cb) {
            cb(null, './uploads/');
        },
        filename: function (req, file, cb) {
            //file.originalname上传文件的原始文件名
            var changedName = (new Date().getTime())+'-'+file.originalname;
            cb(null, changedName);
        }
    })
});

我们先创建了一个upload对象，这个对象中destination函数用来定义上传文件的存储的文件夹；filename函数用来修改上传文件存储到服务器的文件名称，这里我们我们加上一个时间戳简单区分一下。这两个函数都是通过回调函数来实现的。每次上传的时候这两个函数都会调用一次，如果是多个文件上传，那个这两个函数就调用多次，调用顺序是先调用destination，然后调用filename。

在两个函数中都会有一个file对象，表示当前上传的文件对象，有以下几个属性：

• fieldname：上传的字段名
• originalname：上传的文件名
• encoding：文件的编码类型
• mimetype：文件的MIME类型

附：一些常用的MIME类型

定义路由回调

//单个文件上传
app.post('/upload/single',upload.single('singleFile'),(req,res)=>{
    console.log(req.file);
    res.json({
        code: '0000',
        type:'single',
        originalname: req.file.originalname
    })
});

//多个文件上传
app.post('/upload/multer',upload.array('multerFile'),(req,res)=>{
    console.log(req.files);
    let fileList = [];
    req.files.map((elem)=>{
        fileList.push({
            originalname: elem.originalname
        })
    });
    res.json({
        code: '0000',
        type:'multer',
        fileList:fileList
    });
});

在express中定义路由的回调函数时，把定义好了的upload对象作为中间件添加进去。如果是单个文件就用single方法，如果是多个文件就用array方法，这两个方法都需要传一个页面上定义好的字段名。

在路由的回调函数中，request对象已经有了file属性（单个文件上传）或files属性（多个文件上传），files属性是一个数组，数组的每一个对象都有以下属性：

• fieldname：上传的字段名
• originalname：上传的文件名
• encoding：文件的编码类型
• mimetype：文件的MIME类型
• destination：存储的目录（和destination回调函数中的目录名一致）
• filename：保存的文件名（和filename回调函数中的文件名一致）
• path：保存的相对路径
• size：文件的大小（单位：字节byte）

　　我们可以发现在路由的回调函数中的file对象比diskStorage中的file对象多了几个属性，这是因为在diskStorage中文件还没有保存，只能知道文件的大致属性；而路由的回调函数文件已经在服务器上保存好了，文件的保存路径以及文件的大小都是已知的。

混合上传

有时候我们可能需要用字段名来对上传的文件进行一下划分，比如说上传多个图片的时候可能有身份证还有头像。虽然可以分开放到两个接口中，但是会产生其他一系列的麻烦事。multer支持对图片进行字段名的划分。demo3地址

//多字段名上传
let multipleFields = upload.fields([
    {name:'avatar'},
    {name:'gallery', maxCount:3},
]);
app.post('/upload/fields', (req,res)=>{
    multipleFields(req,res,(err) => {
        console.log(req.files);
        if(!!err){
            console.log(err.message);
            res.json({
                code: '2000',
                type: 'field',
                msg:err.message
            })
            return;
        }
        var fileList = [];
        for(let item in req.files){
            var fieldItem = req.files[item];
            fieldItem.map((elem) => {
                fileList.push({
                    fieldname: elem.fieldname,
                    originalname: elem.originalname
                })
            });
        }
        res.json({
            code: '0000',
            type: 'field',
            fileList: fileList,
            msg:''
        })
    });
});

在这边也有req.files

Einführung

Multer ist eine Node.js-Datei-Upload-Middleware. Sie wurde auf Basis von Busboy entwickelt. Die hochgeladenen Formulardaten müssen vom Typ multipart/form-data sein, andernfalls tritt ein Fehler auf wird gemeldet. [Verwandte Empfehlungen: „nodejs Tutorial

"] ​

---

Einfache Verwendung

Speicher definieren

Multer ist eine Middleware von Express, wir können das hochgeladene Dateiverzeichnis und den gespeicherten Dateinamen einfach anpassen. Schauen wir uns zunächst die einfachste Verwendung an: demo1-Adresse

:🎜

{
    "avatar":[{
        fieldname: "",
        originalname: ""
        //...
    }],
    "gallery":[{
        fieldname: "",
        originalname: ""
        //...
    }]
}

🎜Wir erstellen zunächst ein Upload-Objekt in diesem Objekt Mit der Funktion „destination“ wird der Ordner definiert, in dem die hochgeladene Datei gespeichert wird. Mit der Funktion „filename“ wird der Dateiname der auf dem Server gespeicherten Datei geändert. Hier fügen wir einen Zeitstempel hinzu, um eine einfache Unterscheidung vorzunehmen. Beide Funktionen werden durch Callback-Funktionen implementiert. Diese beiden Funktionen werden bei jedem Upload einmal aufgerufen. Wenn mehrere Dateien hochgeladen werden, werden diese beiden Funktionen mehrmals aufgerufen. Die Aufrufreihenfolge besteht darin, zuerst das Ziel und dann den Dateinamen aufzurufen. 🎜🎜In beiden Funktionen wird es ein file-Objekt geben, das das aktuell hochgeladene Dateiobjekt darstellt und die folgenden Attribute hat: 🎜

• fieldname: der hochgeladene Feldname
< li>Originalname: der Name der hochgeladenen Datei
• Kodierung: der Kodierungstyp der Datei
• Mimetyp: der MIME-Typ der Datei

🎜< a href="http ://xieyufei.com/2017/03/29/Project-Summary.html">Anhang: Einige häufig verwendete MIME-Typen🎜🎜🎜🎜🎜Routing-Rückrufe definieren🎜🎜🎜

var upload = multer({
    //...其他代码
    fileFilter: function(req, file, cb){
        if(file.mimetype == 'image/png'){
            cb(null, true)
        } else {
            cb(null, false)
        }
    }
});

🎜Beim Definieren des Routing-Rückrufs Funktion in Express: Fügen Sie das definierte Upload-Objekt als Middleware hinzu. Wenn es sich um eine einzelne Datei handelt, verwenden Sie die Methode single. Wenn es sich um mehrere Dateien handelt, verwenden Sie die Methode array. Beide Methoden müssen einen auf der Seite definierten Feldnamen übergeben. 🎜🎜In der Callback-Funktion der Route verfügt das Anforderungsobjekt bereits über ein Dateiattribut (Hochladen einer einzelnen Datei) oder ein Dateiattribut (Hochladen mehrerer Dateien). Jedes Objekt im Array verfügt über die folgenden Attribute: 🎜

• Feldname: Hochgeladener Feldname
• Originalname: Hochgeladener Dateiname
• Kodierung: Dateikodierungstyp
• Mimetyp: Datei-MIME-Typ< /li >
• Ziel: das Speicherverzeichnis (identisch mit dem Verzeichnisnamen in der Ziel-Callback-Funktion)
• Dateiname: der Name der gespeicherten Datei (identisch mit dem Dateinamen in der Dateinamen-Callback-Funktion)
• Pfad: der relative gespeicherte Pfad
• Größe: die Größe der Datei (Einheit: Byte)

🎜 Das Datei-Objekt-Verhältnis finden wir im Routing-Callback Funktion Das Dateiobjekt in diskStorage verfügt über mehrere weitere Attribute. Dies liegt daran, dass die Datei nicht in diskStorage gespeichert wurde und nur die allgemeinen Attribute der Datei bekannt sind und die Rückruffunktionsdatei der Route auf dem Server gespeichert wurde. Der Speicherpfad und die Dateigröße der Datei sind alle bekannt. 🎜🎜🎜🎜Gemischter Upload🎜🎜🎜🎜 Manchmal müssen wir möglicherweise Feldnamen verwenden, um die hochgeladenen Dateien zu unterteilen. Beim Hochladen mehrerer Bilder können beispielsweise Ausweise und Avatare vorhanden sein. Obwohl es in zwei Schnittstellen unterteilt werden kann, verursacht es eine Reihe anderer Probleme. Multer unterstützt die Aufteilung von Bildern in Feldnamen. demo3-Adresse 🎜🎜

var upload = multer({
    //...其他代码
    limits:{
        //限制文件大小10kb
        fileSize: 10*1000,
        //限制文件数量
        files: 5
    }
});

🎜 hat hier auch das Attribut req.files, aber dieses Attribut Es handelt sich nicht um ein Array, sondern um ein komplexes Objekt. Jeder Attributname ist ein Feldname. Unter dem Array befinden sich Dateiobjekte und -strukturen 🎜🎜Datei-Upload filtern🎜🎜🎜🎜Beim Hochladen von Dateien werden manchmal einige Dateitypen hochgeladen, die wir nicht benötigen, und wir müssen einige unnötige Dateien herausfiltern. 🎜Demo2-Adresse🎜. 🎜🎜🎜🎜🎜Dateitypfilterung🎜🎜🎜

//单个文件上传
let singleUpload = upload.single('singleFile');
app.post('/upload/single',(req,res)=>{
    singleUpload(req,res,(err)=>{
        if(!!err){
            console.log(err.message)
            res.json({
                code: '2000',
                type:'single',
                originalname: '',
                msg: err.message
            })
            return;
        }
        if(!!req.file){
            res.json({
                code: '0000',
                type:'single',
                originalname: req.file.originalname,
                msg: ''
            })
        } else {
            res.json({
                code: '1000',
                type:'single',
                originalname: '',
                msg: ''
            })
        }
    });
});

//多个文件上传
let multerUpload = upload.array('multerFile');
app.post('/upload/multer', (req,res)=>{
    multerUpload(req,res,(err)=>{
        if(!!err){
            res.json({
                code: '2000',
                type:'multer',
                fileList:[],
                msg: err.message
            });
        }
        let fileList = [];
        req.files.map((elem)=>{
            fileList.push({
                originalname: elem.originalname
            })
        });
        res.json({
            code: '0000',
            type:'multer',
            fileList:fileList,
            msg:''
        });
    });
});

🎜 Fügen Sie beim Definieren des Speichers eine fileFilter-Funktion hinzu, um nicht benötigte Dateien herauszufiltern. In der Rückruffunktion übergeben wir true/false, um anzugeben, ob wir speichern möchten it. ;Wenn false übergeben wird, werden die Zielfunktion und die Dateinamenfunktion nicht aufgerufen. 🎜

文件大小和数量过滤

var upload = multer({
    //...其他代码
    limits:{
        //限制文件大小10kb
        fileSize: 10*1000,
        //限制文件数量
        files: 5
    }
});

在定义存储器的时候，新增一个limits对象，用来控制上传的一些信息，它有以下一些属性：

• fieldNameSize：field 名字最大长度，默认值：100 bytes
• fieldSize：field 值的最大长度，默认值：1MB
• fields：非文件 field 的最大数量
• fileSize：在multipart表单中, 文件最大长度 (字节单位)
• files：在multipart表单中, 文件最大数量
• parts：在multipart表单中, part传输的最大数量(fields + files)

在这边我们把fileSize的值设置得小一点，设为10kb方便测试看效果，但是如果这个时候会发现有报错。因为上传的文件大小很容易就会超过10KB，导致有报错出现，我们就需要在路由回调里对错误的情况进行捕获。

//单个文件上传
let singleUpload = upload.single('singleFile');
app.post('/upload/single',(req,res)=>{
    singleUpload(req,res,(err)=>{
        if(!!err){
            console.log(err.message)
            res.json({
                code: '2000',
                type:'single',
                originalname: '',
                msg: err.message
            })
            return;
        }
        if(!!req.file){
            res.json({
                code: '0000',
                type:'single',
                originalname: req.file.originalname,
                msg: ''
            })
        } else {
            res.json({
                code: '1000',
                type:'single',
                originalname: '',
                msg: ''
            })
        }
    });
});

//多个文件上传
let multerUpload = upload.array('multerFile');
app.post('/upload/multer', (req,res)=>{
    multerUpload(req,res,(err)=>{
        if(!!err){
            res.json({
                code: '2000',
                type:'multer',
                fileList:[],
                msg: err.message
            });
        }
        let fileList = [];
        req.files.map((elem)=>{
            fileList.push({
                originalname: elem.originalname
            })
        });
        res.json({
            code: '0000',
            type:'multer',
            fileList:fileList,
            msg:''
        });
    });
});

所有的demo代码都在仓库里，地址：https://github.com/acexyf/multerDemo

更多编程相关知识，请访问：编程入门！！

Das obige ist der detaillierte Inhalt vonDie Nodejs+Express-Middleware implementiert den Datei-Upload. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!