[英]Express & NodeJS : Accessing response parameters from Multipart form POST
I have a simple form that allows the user to upload a file type image, and append the "category" type of the file to the response body, via a radio input selection. 我有一个简单的表单,允许用户上传文件类型图像,并通过无线电输入选择将文件的“类别”类型附加到响应正文。
The file processing itself is handled as expected on the backend - however, when it comes to accessing parameters in the response body, I am receiving UNDEFINED as the parameter value. 文件处理本身在后端按预期处理 - 但是,当访问响应体中的参数时,我接收UNDEFINED作为参数值。 Can anyone lend some pointers on what I may have overlooked ?
任何人都可以对我可能忽略的内容提出一些指示吗?
here is a sample of the mark-up and back end script: 这是标记和后端脚本的示例:
<!DOCTYPE html>
<html>
<head>
<script src="js/blueimp-gallery.min.js" async></script>
<script src="js/bootstrap.min.js" async></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js" async></script>
<script src="js/script.js" async></script>
<link rel="stylesheet" href="css/blueimp-gallery.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div id="main">
<div class="navbar-wrapper" style="border: 12px solid black;">
<ul>
<li><a href="#">Login</a></li>
<li><a href="#">Sign up</a></li>
</ul>
</div>
<div>
<form
id = "uploadForm"
enctype = "multipart/form-data"
action = "/api/photo"
method = "post">
<input type="file" name="userPhoto" />
<input type="submit" value="Upload Image" name="submit">
<label>travel</label>
<input type="radio" value="travel" name="cat">
<label>food</label>
<input type="radio" value="food" name="cat">
<label>community</label>
<input type="radio" value="community" name="cat">
</form>
</div>
</body>
</html>
app.post('/api/photo', function(req,res){
console.log("request to upload image recvied.. upload in progress.");
//console.log("res.catype() = TODO " + req.get("cat"));
// Returning undefined*
console.log("res.catype() = " + res.cat);
// handle file persistence to disk.
upload(req,res,function(err) {
if(err) {
return res.end("Error uploading file.");
}
res.end("File is uploaded");
});
});
您应该从req.body.cat
访问您的cat
值,请参阅http://expressjs.com/en/4x/api.html#req.body以获取更多详细信息
Not sure if you post your entire server-side code, but I don't any reference to the body-parser middleware. 不确定是否发布了整个服务器端代码,但我没有提到body-parser中间件。 You should use it to process any incoming "post".
您应该使用它来处理任何传入的“帖子”。 And you should always declare them before your routes.
你应该总是在你的路线之前申报它们。 This way, you can access the data with
req.body
. 这样,您可以使用
req.body
访问数据。
const bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.post('/api/photo', function(req,res){
console.log("request to upload image recvied.. upload in progress.");
//console.log("res.catype() = TODO " + req.get("cat"));
// Returning undefined*
console.log("res.catype() = " + res.cat);
// handle file persistence to disk.
upload(req,res,function(err) {
if(err) {
return res.end("Error uploading file.");
}
res.end("File is uploaded");
});
});
For multi part forms (forms with an attached file like an image), you need to use Multer (or some other multiform parser) on your NodeJS server instead of body-parser. 对于多部分表单(带有附加文件的表单,如图像),您需要在NodeJS服务器上使用Multer (或其他一些多表单解析器)而不是正文解析器。 The link will give you an example of how to set this up.
该链接将为您提供如何进行此设置的示例。 Assuming your Client side HTML/JS is setup properly, you will be able to extract the image as a file and the request as body info.
假设您的客户端HTML / JS设置正确,您将能够将图像作为文件提取,并将请求作为正文信息提取。
The serverside NodeJS would look something like this: 服务器端NodeJS看起来像这样:
app.post('/api/photo', upload.any(), function (req, res, next) {
var files = req.files;
if (files) {//Checks to see if any attached files
files.forEach(function (file) {
console.log('FILE');
console.log(JSON.stringify(file));//contents of file
console.log(JSON.stringify(file.filename));
});
}
console.log(req.body);
res.sendFile(__dirname + "/resources/JSONStructures/genericResponse.json");
});
If you could post your Client Side JavaScript it would help a little in determining what's causing the issue. 如果你可以发布你的客户端JavaScript,它将有助于确定导致问题的原因。 Specifically I see a lot of AJAX being setup the short and easy way which will cause issues with multi forms.
具体来说,我看到许多AJAX正在设置简短的方法,这将导致多种形式的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.