Hochladen der Datei mit Express 4.0: req.files undefined

Question

Ich versuche, einen einfachen Datei-Upload-Mechanismus mit Express 4.0 zu arbeiten, aber ich bekomme im app.post Körper. Hier ist der relevante Code:

var bodyParser = require('body-parser'); 
var methodOverride = require('method-override'); 
//... 
app.use(bodyParser({ uploadDir: path.join(__dirname, 'files'), keepExtensions: true })); 
app.use(methodOverride()); 
//... 
app.post('/fileupload', function (req, res) { 
    console.log(req.files); 
    res.send('ok'); 
}); 

.. und der dazu gehörige Jade Code:

form(name="uploader", action="/fileupload", method="post", enctype="multipart/form-data") 
    input(type="file", name="file", id="file") 
    input(type="submit", value="Upload") 

Lösung
Dank der Reaktion von mscdex unten habe ich eingeschaltet, um mit busboy statt bodyParser:

var fs = require('fs'); 
var busboy = require('connect-busboy'); 
//... 
app.use(busboy()); 
//... 
app.post('/fileupload', function(req, res) { 
    var fstream; 
    req.pipe(req.busboy); 
    req.busboy.on('file', function (fieldname, file, filename) { 
     console.log("Uploading: " + filename); 
     fstream = fs.createWriteStream(__dirname + '/files/' + filename); 
     file.pipe(fstream); 
     fstream.on('close', function() { 
      res.redirect('back'); 
     }); 
    }); 
}); 

Answer 1

Th Das Modul body-parser verarbeitet nur JSON- und urlencodierte Formulareinreichungen, nicht Multipart (was beim Hochladen von Dateien der Fall wäre).

Für multipart, müssten Sie etwas wie connect-busboy oder multer oder connect-multiparty (multiparty/formidable ist, was ursprünglich in der Express-BodyParser Middleware verwendet wurde) verwenden. Auch FWIW, ich arbeite auf einer noch höheren Ebene über dem Busboy namens reformed. Es kommt mit einer Express-Middleware und kann auch separat genutzt werden.

Answer 2

Es sieht aus wie body-parsertat Support-Dateien in Express Hochladen 3, aber Unterstützung wurde für Express 4 fallen gelassen, wenn es no longer included Connect as a dependency

Nachdem einige der Module in mscdex Antwort suchen, fand ich, dass express-busboy war ein weit bessere Alternative und die nächste Sache zu einem Drop-In-Ersatz. Die einzigen Unterschiede, die ich bemerkte, waren die Eigenschaften der hochgeladenen Datei.

console.log(req.files) Verwendung Körper-parser (Express 3) -Ausgang ein Objekt, das wie folgt aussah:

{ file: 
    { fieldName: 'file', 
    originalFilename: '360px-Cute_Monkey_cropped.jpg', 
    name: '360px-Cute_Monkey_cropped.jpg' 
    path: 'uploads/6323-16v7rc.jpg', 
    type: 'image/jpeg', 
    headers: 
     { 'content-disposition': 'form-data; name="file"; filename="360px-Cute_Monkey_cropped.jpg"', 
     'content-type': 'image/jpeg' }, 
    ws: 
     WriteStream { /* ... */ }, 
    size: 48614 } } 

Vergleich zu console.log(req.files) Verwendung Express-busboy (4 Express):

{ file: 
    { field: 'file', 
    filename: '360px-Cute_Monkey_cropped.jpg', 
    file: 'uploads/9749a8b6-f9cc-40a9-86f1-337a46e16e44/file/360px-Cute_Monkey_cropped.jpg', 
    mimetype: 'image/jpeg', 
    encoding: '7bit', 
    truncated: false 
    uuid: '9749a8b6-f9cc-40a9-86f1-337a46e16e44' } } 

Answer 3

Hier ist, was ich gefunden googlen rund um:

var fileupload = require("express-fileupload"); 

die für Uploads

app.post("/upload", function(req, res) 
{ 
    var file; 

    if(!req.files) 
    { 
     res.send("File was not found"); 
     return; 
    } 

    file = req.files.FormFieldName; // here is the field name of the form 

    file.mv("file.txt", function(err) //Obvious Move function 
     { 
       // log your error 
     }); 

    res.send("File Uploaded"); 


}); 

Answer 4

express-fileupload sieht aus wie die einzige Middleware, die noch funktioniert in diesen Tagen ziemlich einfachen Mechanismus ist.

Mit dem gleichen Beispiel multer und connect-multiparty gibt einen nicht definierten Wert von req.file oder req.files, aber express-fileupload funktioniert.

Und es gibt viele Fragen und Probleme über den leeren Wert von req.file/req.files.

Answer 5

multer ist eine Middleware, die "multipart/form-data" verarbeitet und magisch & stellt die hochgeladenen Dateien und Formulardaten in Anfrage als request.files und request.body zur Verfügung.

Installation multer: - npm install multer --save

in Html-Datei: -

<form method="post" enctype="multipart/form-data" action="/upload"> 
    <input type="hidden" name="msgtype" value="2"/> 
    <input type="file" name="avatar" /> 
    <input type="submit" value="Upload" /> 
</form> 

in Js-Datei: -

var express = require('express'); 
var multer = require('multer'); 
var app = express(); 
var server = require('http').createServer(app); 
var port = process.env.PORT || 3000; 
var upload = multer({ dest: 'uploads/' }); 

app.use(function (req, res, next) { 
    console.log(req.files); // JSON Object 
    next(); 
}); 

server.listen(port, function() { 
    console.log('Server successfully running at:-', port); 
}); 

app.get('/', function(req, res) { 
    res.sendFile(__dirname + '/public/file-upload.html'); 
}) 

app.post('/upload', upload.single('avatar'), function(req, res) { 
    console.log(req.files); // JSON Object 
}); 

hoffe, das hilft!