使用NodeJS进行多部分file upload

我有麻烦获取file upload与NodeJS工作。 我正在使用Dropzone.JS来创build一个发送POST请求到/ file-upload的表单： 

<form action="/file-upload" class="dropzone dragndrop" id="my-awesome-dropzone"></form>

然后我在app.js中有一个路由： 

 app.post('/file-upload', routes.upload);

然后我的经理： 

 exports.upload = function(req, res){ console.log(req.files); res.send("OK"); }

但是，这里的上传function从来没有被调用过。 服务器首先崩溃，出现这个错误： 

 events.js:69 throw arguments[1]; // Unhandled 'error' event ^ Error: Invalid data at WriteStream._write (fs.js:1616:31) at onwrite (_stream_writable.js:265:14) at WritableState.onwrite (_stream_writable.js:94:5) at fs.js:1628:5 at Object.wrapper [as oncomplete] (fs.js:475:5) at process._makeCallback (node.js:321:24)

所以我不确定我该怎么做，因为这似乎不是我的错。 我跟着其他教程，看到没有错。 另外，当我使用chrome dev工具检查我的networking时，它显示： 

 Request URL:http://localhost:3000/file-upload **Request Headers** Accept:application/json Cache-Control:no-cache Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryMmLSkbfQskfIcjfE Origin:http://localhost:3000 Pragma:no-cache Referer:http://localhost:3000/ User-Agent:Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.17 (KHTML, like Gecko) Chrome/24.0.1312.52 Safari/537.17 X-File-Name:Screenshot from 2013-03-20 12:23:42.png X-Requested-With:XMLHttpRequest **Request Payload** ------WebKitFormBoundaryMmLSkbfQskfIcjfE Content-Disposition: form-data; name="file"; filename="Screenshot from 2013-03-20 12:23:42.png" Content-Type: image/png ------WebKitFormBoundaryMmLSkbfQskfIcjfE--

@ user568109和@ nick-fishman是正确的; 你应该使用bodyParser中间件。

请参阅下面的示例代码以获取基本的file upload表单。 （注意：您将需要创build一个“上传”目录来存储文件。）

file-upload.js ： 

 var express = require("express"), app = express(); // tell express to use the bodyParser middleware // and set upload directory app.use(express.bodyParser({ keepExtensions: true, uploadDir: "uploads" })); app.engine('jade', require('jade').__express); app.post("/upload", function (request, response) { // request.files will contain the uploaded file(s), // keyed by the input name (in this case, "file") // show the uploaded file name console.log("file name", request.files.file.name); console.log("file path", request.files.file.path); response.end("upload complete"); }); // render file upload form app.get("/", function (request, response) { response.render("upload_form.jade"); }); app.listen(3000);

views / upload_form.jade ： 

 doctype 5 html head title Upload Form body h1 Upload File form(method="POST", action="/upload", enctype="multipart/form-data") input(type="file", name="file") input(type="submit")

@ user568109是正确的：你需要启用ExpressJS和bodyParser。 在configuration中是否有类似于以下内容的行？ 

 app.use(express.bodyParser({ keepExtensions: true, uploadDir: '/my/files' }));

尝试使用busboy-body-parser来检索请求的主体参数和文件。 

 start.js var bodyParser = require('body-parser'); var busboyBodyParser = require('busboy-body-parser'); // parse application/x-www-form-urlencoded app.use(bodyParser.urlencoded({ extended: true })); // parse application/json app.use(bodyParser.json()); //parse multipart/form-data app.use(busboyBodyParser()); controllers/someController.js someAction: function(req,res){ if(req.method == "POST"){ res.end(JSON.stringify(req.body)+JSON.stringify(req.files)); } } //{"text":"testx"}{"anexo":{"data":{"type":"Buffer","data":.... }}} //req.body = {"text":"testx"} //req.files = {"anexo":{"data":{"type":"Buffer","data":.... }}} views/someController/someAction.html <form method="post" id="multipart" enctype="multipart/form-data"> <input type="text" id="text1" name="text" value="testx" /> <input type="file" id="anexo" name="anexo" /> <input type="submit" value="Enviar" /> </form>

要创build一个file upload，你需要工作，如果stream，例如： 

 /* file props { "data":{"type":"Buffer","data":.... }, "fieldname":"anexo", "originalname":"images (1).jpg", "encoding":"7bit", "mimetype":"image/jpeg", "destination":"c:\\live\\sources\\uploads\\", "filename":"eventclock_images(1)_1443706175833.jpg", "path":"c:\\live\\sources\\uploads\\eventclock_images(1)_1443706175833.jpg", "size":9986 } */ var fileStream = fs.createWriteStream(file.path); fileStream.write(file.data); fileStream.end(); fileStream.on('error', function (err) { //console.log("error",err); }); fileStream.on('finish', function (res) { //console.log("finish",res); });
Interesting Posts