#はじめに
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
#おわりに
参考書で勉強していて困っていた人の助けになれれば光栄です。