提交html表单到nodejs
Posted
技术标签:
【中文标题】提交html表单到nodejs【英文标题】：Submit html form to nodejs 【发布时间】：2022-01-21 17:08:47 【问题描述】：我正在尝试编写一个非常简单的项目，编写一个 web 并将其发送到 node js，这样我就可以保存我得到的信息。
所以，我使用了一些YouTube tutorials，但它似乎不起作用
表格本身只是为了练习，所以我从网上得到的：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Payment form example</title>
<link href="../css/style.css" rel="stylesheet">
</head>
<body>
<form action="/ipo" method="POST" >
<h1>Payment form</h1>
<p>Required fields are followed by <strong><abbr title="required">*</abbr></strong>.</p>
<section>
<h2>Contact information</h2>
<fieldset>
<legend>Title</legend>
<ul>
<li>
<label for="title_1">
<input type="radio" id="title_1" name="title" value="A">
Ace
</label>
</li>
<li>
<label for="title_2">
<input type="radio" id="title_2" name="title" value="K" >
King
</label>
</li>
<li>
<label for="title_3">
<input type="radio" id="title_3" name="title" value="Q">
Queen
</label>
</li>
</ul>
</fieldset>
<p>
<label for="name">
<span>Name: </span>
<strong><abbr title="required">*</abbr></strong>
</label>
<input type="text" id="name" name="username">
</p>
<p>
<label for="mail">
<span>E-mail: </span>
<strong><abbr title="required">*</abbr></strong>
</label>
<input type="email" id="mail" name="usermail">
</p>
<p>
<label for="pwd">
<span>Password: </span>
<strong><abbr title="required">*</abbr></strong>
</label>
<input type="password" id="pwd" name="password">
</p>
</section>
<section>
<h2>Payment information</h2>
<p>
<label for="card">
<span>Card type:</span>
</label>
<select id="card" name="usercard">
<option value="visa">Visa</option>
<option value="mc">Mastercard</option>
<option value="amex">American Express</option>
</select>
</p>
<p>
<label for="number">
<span>Card number:</span>
<strong><abbr title="required">*</abbr></strong>
</label>
<input type="tel" id="number" name="cardnumber">
</p>
<p>
<label for="expiration">
<span>Expiration date:</span>
<strong><abbr title="required">*</abbr></strong>
</label>
<input type="text" id="expiration" required="true" placeholder="MM/YY" pattern="^(0[1-9]|1[0-2])\/([0-9]2)$">
</p>
</section>
<section>
<p> <button type="submit" id="submit">Validate the payment</button> </p>
</section>
</form>
</body>
</html>
而服务器端是：
const host = 'localhost';
const port = 3000;
const express = require('express');
const app = express();
const bodyParser = require('body-parser')
app.use(express.static('public'))
var urlencodedParser = bodyParser.urlencoded( extended: true )
app.get('/', function (req, res)
res.sendFile("/Users/idanhauser/Documents/NodeJs/web/client/pages/index.html");
)
app.listen(port, () =>
console.log(`Example app listening at http://localhost:$port`)
)
app.post('/ipo', urlencodedParser, function (req, res)
console.log(req.params);
console.log(req.body);
console.log("not ok");
res.send("ok");
)
服务器上的最后一个函数，这是监听我请求的函数。
但是当我尝试这样做时，我发现req.body 是空的。
我错过了什么？
非常感谢 伊丹
【问题讨论】：
【参考方案1】：body-parser 已弃用，您可以使用 express 指定中间件，如下所示：
app.use(express.urlencoded( extended: true ));
urlencoded 是解析 HTML 表单数据所需的解析器。
【讨论】：
嘿，谢谢。我也尝试过这样做，但我仍然得到一个空的 req.body ...【参考方案2】：所以您已经设置了urlencodedParser，但您忘记将它添加到您的中间件中：
var urlencodedParser = bodyParser.urlencoded( extended: true )
+ app.use(urlencodedParser);
Docs
【讨论】：
嘿，谢谢你的回答......我也试过了，而且在你添加的链接中，我也试过“Express route-specific”这个例子，但两种方式都不要不行。【参考方案3】：最后，我成功地在服务器中获取了这些数据。 我不明白为什么，但是在更改表格后，它将只有姓名和电子邮件。成功了。
谢谢！
【讨论】：
以上是关于提交html表单到nodejs的主要内容，如果未能解决你的问题，请参考以下文章