Le middleware Nodejs+express implémente le téléchargement de fichiers-js tutoriel-php.cn

Le middleware Nodejs+express implémente le téléchargement de fichiers

青灯夜游

Libérer： 2021-04-16 11:00:49

avant

2254 Les gens l'ont consulté

Cet article vous donnera une introduction détaillée à la méthode de téléchargement de fichiers Nodejs. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

Le middleware Nodejs+express implémente le téléchargement de fichiers

Lorsque j'utilise nodejs pour réaliser des projets, je dois utiliser la fonction de téléchargement de fichiers. J'ai cherché de nombreux tutoriels sur Internet et trouvé un middleware express pour le traitement Le type de données du formulaire peut facilement enregistrer les données du fichier du formulaire sur le serveur. multipart/form-data

Introduction

multer est un middleware de téléchargement de fichiers node.js Il est développé sur la base de busboy Les données du formulaire téléchargé doivent être de type

, sinon elles. signalera une erreur. [Recommandations associées : "multipart/form-datatutoriel nodejs"]

Utilisation simple

Définir la mémoire

Multer comme intermédiaire de fichier express , nous pouvons facilement personnaliser le répertoire des fichiers téléchargés et le nom du fichier enregistré. Examinons d'abord l'utilisation la plus simple,

adresse demo1 :

var express = require(&#39;express&#39;);
var multer = require(&#39;multer&#39;);
var app = express();

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

Copier après la connexion

Nous créons d'abord un objet de téléchargement. La fonction de destination dans cet objet est utilisée pour définir le dossier dans lequel le fichier téléchargé est stocké ; la fonction filename Utilisée pour modifier le nom du fichier téléchargé stocké sur le serveur. Ici, nous ajoutons un horodatage pour le distinguer simplement. Les deux fonctions sont implémentées via des fonctions de rappel. Ces deux fonctions seront appelées une fois pour chaque téléchargement. Si plusieurs fichiers sont téléchargés, ces deux fonctions seront appelées plusieurs fois. La séquence d'appel consiste à appeler d'abord la destination, puis à appeler le nom du fichier.

Il y aura un objet

dans les deux fonctions, qui représente l'objet fichier actuellement téléchargé et possède les attributs suivants : file

Pièce jointe : certaines couramment utilisées ceux de type MIME

Définir le rappel de route

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

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

Copier après la connexion

Lors de la définition de la fonction de rappel de route dans express, mettre l'objet de téléchargement défini ajouté comme middleware. S'il s'agit d'un seul fichier, utilisez la méthode

. S'il s'agit de plusieurs fichiers, utilisez la méthode single. Les deux méthodes nécessitent de transmettre un nom de champ défini sur la page. array

Dans la fonction de rappel de la route, l'objet de requête a déjà un attribut de fichier (téléchargement d'un seul fichier) ou un attribut de fichiers (plusieurs fichiers téléchargés). L'attribut de fichiers est un tableau. Chaque objet du tableau a le. attributs suivants. :

Nous pouvons constater que l'objet fichier dans la fonction de rappel de routage est plus grand que diskStorage L'objet fichier a plusieurs attributs supplémentaires. En effet, le fichier n'a pas été enregistré dans diskStorage, et seuls les attributs généraux du fichier peuvent être connus et le fichier de fonction de rappel de la route a été enregistré sur le serveur, le fichier ; le chemin de sauvegarde et les tailles du fichier sont toutes connues.

Téléchargement mixte

Parfois, nous pouvons avoir besoin d'utiliser des noms de champs pour diviser les fichiers téléchargés, par exemple pour télécharger plusieurs images. Carte d'identité et photo de profil. Bien qu'il puisse être séparé en deux interfaces, cela entraînera une série d'autres problèmes. multer prend en charge la division des images en noms de champs.

adresse demo3

//多字段名上传
let multipleFields = upload.fields([
    {name:&#39;avatar&#39;},
    {name:&#39;gallery&#39;, maxCount:3},
]);
app.post(&#39;/upload/fields&#39;, (req,res)=>{
    multipleFields(req,res,(err) => {
        console.log(req.files);
        if(!!err){
            console.log(err.message);
            res.json({
                code: &#39;2000&#39;,
                type: &#39;field&#39;,
                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: &#39;0000&#39;,
            type: &#39;field&#39;,
            fileList: fileList,
            msg:&#39;&#39;
        })
    });
});

Copier après la connexion

a également l'attribut

ici, mais cet attribut n'est pas un tableau, mais un objet complexe. Il y a plusieurs attributs dans cet objet, chaque attribut Le nom est. un nom de champ, et sous chaque attribut se trouve un tableau. Sous le tableau se trouvent les objets fichier. La structure est à peu près la suivante : req.files

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

Copier après la connexion

Filtrer le téléchargement de fichiers

<🎜. >Lors du téléchargement de fichiers, certains types de fichiers dont nous n'avons pas besoin sont parfois téléchargés et nous devons filtrer certains fichiers inutiles.

Adresse démo2

Filtrage par type de fichier

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

Copier après la connexion

Lors de la définition de la mémoire, ajoutez une fonction fileFilter pour filtrer ce dont nous n'avons pas besoin de fichier , dans la fonction de rappel, nous passons true/false pour indiquer s'il faut le sauvegarder ; si false est passé, la fonction de destination et la fonction de nom de fichier ne seront pas appelées.

文件大小和数量过滤

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

Copier après la connexion

在定义存储器的时候，新增一个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(&#39;singleFile&#39;);
app.post(&#39;/upload/single&#39;,(req,res)=>{
    singleUpload(req,res,(err)=>{
        if(!!err){
            console.log(err.message)
            res.json({
                code: &#39;2000&#39;,
                type:&#39;single&#39;,
                originalname: &#39;&#39;,
                msg: err.message
            })
            return;
        }
        if(!!req.file){
            res.json({
                code: &#39;0000&#39;,
                type:&#39;single&#39;,
                originalname: req.file.originalname,
                msg: &#39;&#39;
            })
        } else {
            res.json({
                code: &#39;1000&#39;,
                type:&#39;single&#39;,
                originalname: &#39;&#39;,
                msg: &#39;&#39;
            })
        }
    });
});

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

Copier après la connexion

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

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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!