LoginSignup
2
2

More than 3 years have passed since last update.

Express Validator ver.6に対応する

Last updated at Posted at 2020-04-09

はじめに

Node.js超入門第2版でnode.jsの勉強をしています。
express-validatorがAPI変更されたため、参考書のソースだとバリデーションが実行されなかったので変更点と改善方法を投稿しました。
※P334~335の内容

環境

・node 12.7.0
・express 4.16.1
・express-validator 5.3.1

変更前(ver.5)

app.js
var validator = require('express-validator');
app.use(validator());
hello.js
router.get('/add',(req,res,next) => {
  var data = {
    title: 'Hello/Add',
    content: '新しいレコードを入力:',
    form: {
      name: '',
      mail: '',
      age: 0
    }
  }
  res.render('hello/add',data);
});

router.post('/add',(req,res,next) => {
  req.check('name','名前は必ずご入力してください。').notEmpty();
  req.check('mail','メールアドレスをご入力してください。').isEmail();
  req.check('age','年齢は整数をご入力してください。').isInt();

  req.getValidationResult().then((result) => {
    if(!result.isEmpty()) {
    var re = '<ul class="error">';
    var result_arr = result.array();
    for(var n in result_arr){
      re += '<li>' + result_arr[n].msg + '</li>';
    }
    re += '</ul>';
    var data = {
      title: 'Hello/add',
      content: re,
      form: req.body
    }
    res.render('hello/add',data);
    }
    else{
      var nm = req.body.name;
      var ml = req.body.mail;
      var ag = req.body.age;
      var data  = {
        'name': nm,
        'mail': ml,
        'age': ag
      };
      var connection = mysql.createConnection(mysql_setting);

      connection.connect();

      connection.query('insert into mydata set ?',data,
        function(error,results,fields){
          res.redirect('/hello');
        });
      connection.end();
    }
  });
});

変更箇所

express-validatorのインスタンス生成方法

hello.js
const { check, validationResult } = require('express-validator/check');
  • app.use(validator());が使えなくなっているため。
  • Express-validatorをhello.jsで読み込む

バリデーションチェック方法

変更前

hello.js
router.post('/add',(req,res,next) => {
  req.check('name','名前は必ずご入力してください。').notEmpty();
  req.check('mail','メールアドレスをご入力してください。').isEmail();
  req.check('age','年齢は整数をご入力してください。').isInt();
});

変更後

hello.js
router.post('/add', [
  check('name','名前は必ずご入力してください。').not().isEmpty(),
  check('mail','メールアドレスをご入力してください。').isEmail(),
  check('age','年齢は整数をご入力してください。').isInt()
],(req,res,next) => {
// チェック処理を記述
});
  • req.check()ではなくcheck()でExpressValidator.Validatorのオブジェクトを返す
  • 第1引数にPOST処理後のパス、第2引数に配列型式でチェック項目で、第3引数にチェック処理を記述する。
  • notEmpty()が使えなくなっているので、.not().isEmpty()を使う。

変更後(ver.6)

hello.js
// Express-validatorを読み込む
const { check, validationResult } = require('express-validator/check');

router.get('/add',(req,res,next) => {
  var data = {
    title: 'Hello/Add',
    content: '新しいレコードを入力:',
    form: {
      name: '',
      mail: '',
      age: 0
    }
  }
  res.render('hello/add',data);
});

router.post('/add', [
  check('name','名前は必ずご入力してください。').not().isEmpty(),
  check('mail','メールアドレスをご入力してください。').isEmail(),
  check('age','年齢は整数をご入力してください。').isInt()
],(req,res,next) => {
// getValidationResult()ではなく、validationResult(req)でバリデーションの実行結果を受け取る。
  var result = validationResult(req);
// チェック項目があった場合
  if(!result.isEmpty()) {
    var re = '<ul class="error">';
    var result_arr = result.array();
    for(var n in result_arr){
      re += '<li>' + result_arr[n].msg + '</li>';
    }
    re += '</ul>';
    var data = {
      title: 'Hello/add',
      content: re,
      form: req.body
    }
    res.render('hello/add',data);
  }
// チェックを通過した場合
  else{
    var nm = req.body.name;
    var ml = req.body.mail;
    var ag = req.body.age;
    var data  = {
      'name': nm,
      'mail': ml,
      'age': ag
    };
    var connection = mysql.createConnection(mysql_setting);

    connection.connect();

    connection.query('insert into datamy set ?',data,function(error,results,fields){
      res.redirect('/hello');
    });
    connection.end();
  }
});

参考

https://express-validator.github.io/docs/index.html
https://www.shuwasystem.co.jp/book/9784798055220.html

おわりに

参考書で勉強していて困っていた人の助けになれれば光栄です。

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2