Renommer un fichier téléchargé en utilisant Multer ne fonctionne pas (Express.js)

Question

J'essaye de télécharger un fichier à partir d'un formulaire HTML en utilisant Express.js et Multer. J'ai réussi à enregistrer le fichier à l'emplacement souhaité (un dossier nommé télécharge).

Cependant, je voudrais renommer le fichier en le téléchargeant car, par défaut, Multer donne un nom étrange, comme:

5257ee6b035926ca99923297c224a1bb

peut-être un horodatage hexadécimal ou alors, mais j'ai besoin d'un nom plus explicite afin d'appeler un script dessus plus tard.

J'ai suivi l'explication trouvée here mais elle ne fait rien de plus qu'utiliser pour: télécharger le fichier avec le nom hexa.

En outre, les deux événements onFileUploadStart et onFileUploadComplete ne semblent jamais être déclenchée que je ne suis rien connecté ma console.

J'utilise deux fichiers séparés pour le serveur et le routage:

app.js

/** 
* Dependencies 
*/ 

var express = require('express'); 
var path = require('path'); 
var logger = require('morgan'); 
var cookieParser = require('cookie-parser'); 
var bodyParser = require('body-parser'); 

/** 
* Importation of routes 
*/ 
var routes = require('./routes/index'); 
var recog = require('./routes/recog'); 

/** 
* Express 
*/ 
var app = express(); 

app.use(logger('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({extended: false})); 
app.use(cookieParser()); 
app.use(express.static(path.join(__dirname, 'public'))); 

// pour contrer les erreurs de cross domain 
app.use(function (req, res, next) { 

    // Website you wish to allow to connect 
    res.setHeader('Access-Control-Allow-Origin', '*'); 

    // Request methods you wish to allow 
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE'); 

    // Request headers you wish to allow 
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type'); 

    // Set to true if you need the website to include cookies in the requests sent 
    // to the API (e.g. in case you use sessions) 
    res.setHeader('Access-Control-Allow-Credentials', true); 

    // Pass to next layer of middleware 
    next(); 
}); 

/** 
* Routes 
*/ 
app.use('/', routes); 
app.use('/recog', recog); 

module.exports = app; 

recog.js

/** 
* Requirements 
*/ 
var express = require('express'); 
var router = express.Router(); 
var multer = require('multer'); 
var uploads = multer({ 
    dest: 'uploads/', 
    rename: function (fieldname, filename) { 
     console.log("Rename..."); 
     return filename + Date.now(); 
    }, 
    onFileUploadStart: function() { 
     console.log("Upload is starting..."); 
    }, 
    onFileUploadComplete: function() { 
     console.log("File uploaded"); 
    } 
}); 

/** 
* Upload d'une image 
*/ 
router.post('/upload', uploads.single('image'), function (req, res, next) { 
    console.log("Front-end is calling"); 
    res.json({status: 'success', data: 'Fichier chargé.\nOrgane sélectionné : ' + req.body.organ}); 
}); 

module.exports = router; 

I Ha J'ai creusé autour mais je ne peux pas comprendre quel est le problème car je suis assez nouveau pour Node.js et JavaScript en général.

Merci pour votre aide les gars!

Answer 1

L'utilisation de Multer a changé.

constructeur Actuellement Multer accepte que trois options:

1. dist/stockage
2. Filefilter
3. limites

maintenant renommer, onFileUploadStart, onFileUploadComplete ne fonctionnerait pas.

cependant changement de nom peut être fait en utilisant DiskStorage

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
     cb(null, '/tmp/my-uploads') 
    }, 
    filename: function (req, file, cb) { 
     cb(null, file.fieldname + '-' + Date.now()) 
    } 
}) 

var upload = multer({ storage: storage }) 

un coup d'oeil à ces liens:

• https://github.com/expressjs/multer
• multer callbacks not working ?

Answer 2

Personnellement, je mis en œuvre les solutions suivantes, génère un nom aléatoire pour les fichiers et ajoute l'extension de fichier d'origine (je suppose que mon extension est après la dernière.)

var path = require('path'); 

    var options = multer.diskStorage({ destination : 'uploads/' , 
     filename: function (req, file, cb) { 
     cb(null, (Math.random().toString(36)+'00000000000000000').slice(2, 10) + Date.now() + path.extname(file.originalname)); 
     } 
    }); 

    var upload= multer({ storage: options }); 

    router.post('/cards', upload.fields([{ name: 'file1', maxCount: 1 }, { name: 'file2', maxCount: 1 }]), function(req, res, next) { 
    /* 
     handle files here 
     req.files['file1']; //First File 
     req.files['file2']; //Second File 
     req.body.fieldNames;//Other Fields in the form 

    */ 
    }); 

Dans la documentation MULTER vous trouverez ceci:

Le moteur de stockage de disque vous donne un contrôle complet sur le stockage des fichiers sur le disque .

Il y a deux options disponibles, destination et nom. Ils sont les deux fonctions qui déterminent où le fichier doit être stocké.

Note: Vous êtes responsable de la création du répertoire lors de la fourniture de destination en fonction. Lors du passage d'une chaîne, multer fera que le répertoire est créé pour vous.

nom

est utilisé pour déterminer ce que le fichier doit être nommé dans le dossier . Si aucun nom de fichier n'est donné, chaque fichier recevra un nom aléatoire qui n'inclut aucune extension de fichier.

Note: Multer n'ajoutera une extension de fichier pour vous, votre fonction doit retourner un nom de fichier avec une extension de fichier.

Answer 3

Je sais ce post est daté. Je veux contribuer à ceux qui pourraient arriver plus tard. Voici un script de serveur fonctionnel complet pour gérer plusieurs images téléchargées avec des noms d'images enregistrés au hasard et l'extension de fichier.

var express = require("express"); 
var multer = require("multer"); 
var app = express(); 
var path = require("path"); 
var uuid = require("uuid"); 

// Allow cross origin resource sharing (CORS) within our application 
app.use(function(req, res, next) { 
    res.header("Access-Control-Allow-Origin", "*"); 
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); 
    next(); 
}); 

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
    cb(null, 'uploadedimages/') 
    }, 
    filename: function (req, file, cb) { 
    cb(null, uuid.v4() + path.extname(file.originalname)); 
    } 
}) 

var upload = multer({ storage: storage }) 

// "files" should be the same name as what's coming from the field name on the client side. 
app.post("/upload", upload.array("files", 12), function(req, res) { 
    res.send(req.files); 
    console.log("files = ", req.files); 
}); 

var server = app.listen(3000, function() { 
    console.log("Listening on port %s...", server.address().port); 
}); 

Answer 4

nous donner un nom au hasard à déposer à l'aide de la date et ajoute l'extension fichier original avec l'aide de file.mimetype

essayer console.log (file.mimetype) vous obtiendrez le nom du fichier et l'extension séparé par '/', je le divise en tableau et récupère l'extension. Essayez le code ci-dessous.

let storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
    cb(null, './uploads') 
    }, 
    filename: function (req, file, cb) { 
    let extArray = file.mimetype.split("/"); 
    let extension = extArray[extArray.length - 1]; 
    cb(null, file.fieldname + '-' + Date.now()+ '.' +extension) 
    } 
}) 
const upload = multer({ storage: storage }) 

Answer 5

essayer de cette façon que je suis en utilisant

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
     cb(null, 'uploads/') 
    }, 
    filename: function (req, file, cb) { 
     console.log(file); 
     var fileObj = { 
     "image/png": ".png", 
     "image/jpeg": ".jpeg", 
     "image/jpg": ".jpg" 
     }; 
     if (fileObj[file.mimetype] == undefined) { 
     cb(new Error("file format not valid")); 
     } else { 
     cb(null, file.fieldname + '-' + Date.now() + fileObj[file.mimetype]) 
     } 
    } 
    }) 

    var upload = multer({ storage: storage }) 

Answer 6

fichier a une structure comme ceci:

{ 
"fieldname": "avatar", 
"originalname": "somefile.pdf", 
"encoding": "7bit", 
"mimetype": "application/pdf", 
"destination": "./uploads", 
"filename": "36db44e11b83f4513188f649ff445a2f", 
"path": "uploads\\36db44e11b83f4513188f649ff445a2f", 
"size": 1277191 

}

L'exemple suivant enregistre le fichier avec c'est un nom d'origine extension et non avec le nom étrange comme c'est par défaut. (Au lieu de « file.originalname », vous pouvez l'enregistrer comme vous voulez)

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
    cb(null, './uploads') //Destination folder 
    }, 
    filename: function (req, file, cb) { 
    cb(null, file.originalname) //File name after saving 
    } 
}) 

var upload = multer({ storage: storage })