Node.js multer Error: Unexpected field
18,930
Solution 1
The formData.append assigned field name needs to match the server's expected field name set for Multer.
formData.append("streamfile", uploadfile);
Solution 2
try following code in html remove all javascript code
<form action="http://localhost:8989/fileupload" method="post" enctype="multipart/form-data">
<input type="file" name="streamfile">
<input type="submit" data-inline="true" value="Input" id="filesubmit">
</form>
Author by
geoseong
Updated on June 15, 2022Comments
-
geoseong almost 2 years
I have trouble with Node.js multer ...
I want to know what causes this problem. I think I set the right name of
input[name=streamfile]
between client and node.js's multerupload.single('streamfile')
.I have no idea what other elements cause this problem.
Here is my code below.. Thanks.
Error Msg
Error: Unexpected field at makeError (/Users/taeseongpark/Documents/Study/NodeJS/node_basic_test/node_modules/multer/lib/make-error.js:12:13) at wrappedFileFilter (/Users/taeseongpark/Documents/Study/NodeJS/node_basic_test/node_modules/multer/index.js:40:19) at Busboy.<anonymous> (/Users/taeseongpark/Documents/Study/NodeJS/node_basic_test/node_modules/multer/lib/make-middleware.js:114:7) at emitMany (events.js:127:13) at Busboy.emit (events.js:201:7) at Busboy.emit (/Users/taeseongpark/Documents/Study/NodeJS/node_basic_test/node_modules/busboy/lib/main.js:38:33) at PartStream.<anonymous> (/Users/taeseongpark/Documents/Study/NodeJS/node_basic_test/node_modules/busboy/lib/types/multipart.js:213:13) at emitOne (events.js:96:13) at PartStream.emit (events.js:188:7) at HeaderParser.<anonymous> (/Users/taeseongpark/Documents/Study/NodeJS/node_basic_test/node_modules/dicer/lib/Dicer.js:51:16)
Client HTML
<form action="http://localhost:8989/fileupload" method="post" enctype="multipart/form-data"> <input type="file" name="streamfile"> <input type="button" data-inline="true" value="Input" id="filesubmit"> </form> <script lang="javascript"> $('form #filesubmit').on('click', (e)=>{ var uploadfile = $("input[name=streamfile]")[0].files[0]; var formData = new FormData(); formData.append("myfile", uploadfile); console.log('uploadfile', uploadfile, uploadfile.type); var localurl = 'http://localhost:8989/fileupload' $.ajax({ url: localurl, // googleCloud data: formData, processData: false, contentType: false, type: 'POST', success: function(data){ console.log('response data', data); } }); }); </script>
Node.js Server
var express = require('express') var multer = require('multer') var upload = multer({ dest: 'uploads/' }) var app = express() app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", "*"); res.header("Access-Control-Allow-Headers", 'Content-Type, Authorization, Content-Length, X-Requested-With'); res.header("Access-Control-Allow-Methods", "PUT, POST, GET, OPTIONS, DELETE"); next(); }); app.post('/fileupload', upload.single('streamfile'), function (req, res) { console.log('req.file', req.file); // req.file is the `avatar` file // req.body will hold the text fields, if there were any }) // Connect to Web Server var port = '8989'; app.listen(port, () => { console.log('[Express] fileupload started at %d port', port); }); // "express": "^4.16.2", "multer": "^1.3.0",