无法使用 node express 和 ejs 在 html 页面上显示 express 验证器生成的错误答案

【问题标题】：Having trouble showing errors generated by express validator on html page with node express and ejs无法使用 node express 和 ejs 在 html 页面上显示 express 验证器生成的错误
【发布时间】：2020-02-08 08:54:09
【问题描述】：

我正在使用 nodejs、ejs、express 和 express-validator。我正在尝试在我的注册页面（注册，ejs）上使用快速验证器。 Express-validator 在对象数组中生成错误。当我 console.log 结果（在 var 错误中）时，我得到：

      formatter: [Function: formatter],
      errors:
       [ { value: 'kl',
           msg: 'Username must be between 4 and 15 characters.',
           param: 'username',
           location: 'body' },
         { value: 'kl',
           msg: 'Password must be between 8 and 100 characters.',
           param: 'password',
           location: 'body' },
         { value: 'klsdflksdf',
           msg: 'Passwords must match.',
           param: 'confirmPassword',
           location: 'body' } ] }

当我尝试使用 For Of 在我的视图页面 (signup.ejs) 上迭代数组时，我得到错误是 err 不可迭代。当我使用 For In（如下所示）时，结果是我的视图页面上显示了两个项目。第一个是Fromatoer，第二个是错误。我如何获得味精：价值显示？替换为在视图页面上不会产生任何结果。

这是我的浏览页面：

    <%- include('includes/navigation.ejs') %>
    <% if (typeof errors !== "undefined") { %>
        <p>there are errors on page</p>
    <% for(const error in errors) { %>
    <div class="alert alert-warning">
      <li>  <%= error %>  </li>
    </div>
    <% } %>
    <% } %>
    <div class="container">
        <form class="signup-form" action="/signup" method="POST">
            <div class="form-group">
                <label for="username">Username</label>
                <input type="text" class="form-control" id="username" name="username" placeholder="Enter username">

            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input type="password" class="form-control" id="password" name="password" placeholder="Password">
            </div>
            <div class="form-group">
                <label for="confirmPassword">Confirm Password</label>
                <input type="password" class="form-control" id="confirmPassword" name="confirmPassword"
                    placeholder="Confirm Password">
            </div>

            <button type="submit" class="btn btn-primary">Submit</button>
        </form>
    </div>

这是我的控制器：

exports.postSignup = [
    check('username', 'Username field must not be empty.').not().isEmpty(),
    check('username', 'Username must be between 4 and 15 characters.').isLength(4, 15),
    check('password', 'Password must be between 8 and 100 characters.').isLength(8, 100),
    check('confirmPassword', 'Passwords must match.').equals('password'),
    (req, res, next) => {

        const username = req.body.username;
        const password = req.body.password;
        const confirmPassword = req.body.confirmPassword;

        const errors = validationResult(req);


        if (errors) {
            console.log(errors);

            res.render('signup', {
                pageTitle: 'Registration Error',
                errors: errors
            });
        } else {
            User.create({
                username: req.body.username,
                password: req.body.password
            })
                .then(result => {
                    res.render('login', { pageTitle: "Signup Successfull" });
                })
                .catch(err => console.log(err));
        };
    }
];

【问题讨论】：

只是一个建议。 for in 旨在用于对对象属性的迭代，而不是最适合与数组一起使用。因为Array.forEach 或for of 更好。

标签： mysql node.js express ejs express-validator

【解决方案1】：

检查是否存在任何验证错误的方式应该不同。在这行代码之后，您不会得到可迭代数组。

const errors = validationResult(req);

您需要使用isEmpty()方法检查是否存在错误；和array() 方法将errors 转换为可迭代数组。通常错误处理程序如下所示：

const errorHandler = (req, res, next) => {
    let errors = validationResult(req);
    if (!errors.isEmpty()) {
        errors = errors.array();
        // some other stuff
    } else next();
};

来源：express-validator docs

【讨论】：