javascript - 在客户端的 XMLHttpRequest 之后,如何在服务器端获取 FormData 值?
问题描述
我正在构建一个单页应用程序,用户可以在其中上传要批准或拒绝的图片。
上传图片后,用户可以到待处理区域对照片进行审批或拒绝。
如果用户拒绝照片,他必须从下拉菜单中提供原因。
当我在客户端提交 XMLHttpRequest 时,我无法在服务器端获取 FormData 值。
如何解析或获取在服务器端提交的 FormData 值?
这是服务器端代码。我正在使用 ExpressJS。
// Parse request bodies
app.use(express.urlencoded({ extended: false }));
app.post("/products/approved/:id", async (req, res) => {
console.log(req.body); // I want to get FormData values here
try {
const pId = req.params.id;
await Product.updateOne({pId}, {status: "approved"});
res.send({message: 'Product has been updated to approved status'});
} catch(e) {
res.send({message: e});
}
});
这是客户端代码。我使用香草 JS。
$(rejectInputBtn).on('click', function(e) {
e.preventDefault();
const currentOption = $( "#rejection-select option:selected" ).text();
console.log(currentOption);
if (currentOption === "--Please choose an option--") {
alert('Please select an option!');
return;
}
const id = $(this).parent().parent().parent().find('h2').html();
const xhr = new XMLHttpRequest();
xhr.responseType = 'json';
xhr.open('POST', `/products/rejected/${id}`, true);
let formData = new FormData(document.getElementById('myform'));
xhr.send(formData);
xhr.onload = function() {
console.log(this.response);
}
});
当我在服务器端使用 console.log(req.body) 时,我不断收到 {}。请帮忙。
解决方案
为了访问你必须解析它的主体,你应该使用 bodyParser。
步骤1
安装bodyParser
$ npm install body-parser
第2步
在 app.js 中使用它,如下所示:
var bodyParser = require('body-parser')
// create application/json parser
var jsonParser = bodyParser.json()
// create application/x-www-form-urlencoded parser
var urlencodedParser = bodyParser.urlencoded({ extended: false })
// POST /login gets urlencoded bodies
app.post('/login', urlencodedParser, function (req, res) {
res.send('welcome, ' + req.body.username)
})
推荐阅读
- python - 使用scrapy获取表单请求的响应
- kubernetes - 无法从 Windows GKE pod 中访问互联网
- python - Python - 用多态性替换许多 if else
- github-api - Github 304 响应似乎计入速率限制
- python - 如何从网页上的下拉列表中提取数据并使用python在excel中打印
- r - 是否有一个函数可以计算许多(997)个不同股票的数据集的回报?
- python - 抽查ml模型。我如何适合所有模型我是否使用 for 循环
- angular - 如何在存储库中使用两种方法制作一种方法
- python - configure.py:错误:没有这样的选项:--no-use-shipped-boost
- ruby-on-rails - 修复 Arel 错误 ActiveRecord::StatementInvalid (PG::UndefinedFunction: ERROR: operator does not exist: timestamp without time zone = integer