最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

在登录注册表单的请求正文中传输数据时遇到问题

网站源码admin42浏览0评论

在登录/注册表单的请求正文中传输数据时遇到问题

在登录/注册表单的请求正文中传输数据时遇到问题

我已经使用 NodeJS 制作了登录/注册页面和相应的路由。我面临的问题是,在单击提交按钮时,注册路由正在调用,但数据未在请求正文中传输。 显示此错误消息

{“消息”:“用户验证失败:用户名:路径

username
是必需的。,密码:路径
password
是必需的。”}, 我也在邮递员上跑过这条路线。那里一切正常。数据已正确存储在数据库中。

这是注册表。

<div id="signup-form">
        <h2>Signup</h2>
        <form method="post" action="/signup">
            <div class="form-floating mb-3">
                <input type="text" class="form-control" for="username">
                <label for="username">Username</label>
            </div>
            <div class="form-floating">
                <input type="password" class="form-control" for="password">
                <label for="password">Password</label>
            </div>

            <button type="submit" class="btn btn-primary" onclick="showLoginForm()">Signup</button>
        </form>
        <div class="instead-button">
            <button class="btn btn-primary" onclick="showLoginForm()">Login instead</button>
        </div>
    </div>

这是后端代码

app.post('/signup', async (req, res) => {
  try {
    console.log('inside');
    const { username, password } = req.body;
    const user = await User.create({ username, password });
    res.status(201);
  } catch (error) {
    res.status(400).json({ message: error.message });
  }
});
回答如下:

您在 HTML 代码中犯了一个小错误。 当您提交表单时,主体将由输入字段的

name
属性获取。
但是
您已将
for
属性添加到
input
字段。并且缺少
name
属性。

因此问题是。

将您的代码更改为此:

<div id="signup-form">
        <h2>Signup</h2>
        <form method="post" action="/signup">
            <div class="form-floating mb-3">
                <input type="text" class="form-control" name="username">
                <label for="username">Username</label>
            </div>
            <div class="form-floating">
                <input type="password" class="form-control" name="password">
                <label for="password">Password</label>
            </div>

            <button type="submit" class="btn btn-primary" onclick="showLoginForm()">Signup</button>
        </form>
        <div class="instead-button">
            <button class="btn btn-primary" onclick="showLoginForm()">Login instead</button>
        </div>
    </div>

这将解决问题。

发布评论

评论列表(0)

  1. 暂无评论