这是我的HTML表单：
<form id="task-form" action="/mytask" method="POST">
<input type="text" name="name" placeholder="name of task" />
<input type="text" name="description" placeholder="description" />
<input type="submit" />
</form>
我想将数据存储到MongoDB，该代码与以下代码配合使用非常好。不幸的是，单击按钮后，我当然可以看到不需要的JSON。
app.post("/mytask", urlencodedParser, (req, res) => {
const task = new Task(req.body);
task
.save()
.then(() => {
res.send(task);
})
.catch(e => {
res.status(400).send(e);
});
});
我也想呈现一个谢谢页面，其中包含request.body中的信息。这也可以。
app.post("/mytask", urlencodedParser, (req, res) => {
res.render("thankyou", {
name: req.body.name,
description: req.body.description
});
});
但是我想两者都做。存储数据并呈现另一个页面，类似这样。
app.post("/mytask", urlencodedParser, (req, res) => {
const task = new Task(req.body);
task
.save()
.then(() => {
res.send(task);
})
.catch(e => {
res.status(400).send(e);
});
res.render("thankyou", {
name: req.body.name,
description: req.body.description
});
});
这似乎是不可能的。错误如下：
[ERR_HTTP_HEADERS_SENT]：C：\ Users \ User \ Desktop \ MyExpressApp \ views \ thankyou.hbs：无法设置标头发送到客户端后
我该如何解决？
提及正在使用的前端会更有帮助。从外观上看，您仅呈现了一个JSON任务对象。这就是为什么在第一个代码中单击提交后看到json的原因。
错误在最后一个代码中发生，因为您正在发送感谢消息，但是在保存操作完成之后，您试图发送另一个与任务对象有关的响应。对于请求，您只能发送一个回复。
[可能的方法是使用任何渲染引擎渲染新的html，或使用诸如angular的前端框架，做出反应以接收消息并显示它。
例如，如果您使用ejs，代码将类似于
app.post("/mytask", urlencodedParser, (req, res) => {
const task = new Task(req.body);
task
.save()
.then(() => {
res.render("index", {
name: task.name,
description: task.description
});
})
.catch(e => {
res.status(400).send(e);
});
});
index.ejs文件
<html>
<head><title><%= title %></title></head>
<body>
<p>Thank you</p>
<p> <%= name %> </p>
<p> <%= description%> </p>
</body>
</html>