0

您好,感谢您的阅读。我尝试使用快速验证器。如果名称输入为空,它可以正常工作并阻止帖子。但我不知道如何才能在正面收到错误消息。我尝试了很多事情都没有成功。希望有人可以提供帮助,并对消息的大小感到抱歉。如果可以提供帮助,这里是快速验证器文档的链接(https://express-validator.github.io/docs/

我的代码...我创建了一个基本表单:

 <form id="sign-in">
      <div class="form-group">
        <label for="nom">name</label>
        <input id="name" type="text" class="form-control" placeholder="name" autocomplete="family-name">
      </div>

      <div class="form-group">
        <label for="username">username</label>
        <input id="username" type="text" class="form-control" placeholder="username" autocomplete="given-name">
      </div>


      <div class="form-group">
        <label for="email">email</label>
        <input id="email" class="form-control" type="email" placeholder="monemail@gmail.com" autocomplete="email"></input>
      </div>

      <div class="form-group">
        <label for="password">password</label>
        <input id="password" class="form-control" type="password" autocomplete="current-password"></input>
      </div>

      <div class="form-group">
        <label for="confirm-password">confirm-password</label>
        <input id="confirm-password" class="form-control" type="password" autocomplete="current-password"></input>
      </div>

      <button type="submit" class="btn btn-primary">sign-in</button>
    </form>
</section>


<footer>
</footer>
<script type="module" src="/js/sign-in.js"></script> 

然后我对文件 sign-in.js 进行提取:

document.getElementById('sign-in').addEventListener('submit', event => { 
event.preventDefault()

const name = document.getElementById('name').value
const username = document.getElementById('username').value
...

// Use fetch to post data into the DB
window.fetch(`${config.serverHost}/sign-in`, {
  method: 'post',
  body: JSON.stringify({
    name,
    username,
    ...
  })
}).then((res, errors) => {
  if (res.status === 200) {
    window.parent.location.reload()
  } else if (res.status === 422) {
    DONT KNOW WHAT TO DO TO GET MY ERROR MESSAGE
  }
})

})

最后是服务器端:

app.post('/sign-in', (req, res, next) => {
// Start express validator //
  req.checkBody('name', 'Please write your name').notEmpty()
  req.checkBody('username', 'Please write your name').notEmpty()
  ...

  const errors = req.validationErrors()

    if (errors) {
      SEND ME BACK MY ERROR MESSAGE
    } else {
      this part works fine, thank you
    }  
  }) 
4

2 回答 2

0

根据您的客户端的设置方式,您有两种选择:

  1. 使用express-flashconnect-flash将错误发送回您的视图。有关差异,请参见this
  2. 用于res.json发回errors您从中创建的对象validationErrors()。请务必同时设置适当的 HTTP 状态。
于 2018-05-29T18:17:50.573 回答
0

当我找到我发布的解决方案时,它可能对其他人有用。这是 login.js 文件:

.then(res => {
  if (res.status !== 200) {
    res.json()
    .then(res => errorsMessages.innerHTML = res.map(e => `<p>${e.msg}</p>`).join(''))
  } else {
    window.parent.location.reload()
  }
})

以及服务器的代码:

const errors = req.validationErrors()
  if (errors) {
    res.status(422).json(errors)
  } else {...}

谢谢弗朗西斯科的帮助。

于 2018-05-30T20:44:18.797 回答