节点/expression4:在ajax文章上用express-validator显示错误
我是新来的节点,并试图显示validation错误(使用expressionvalidation和expression4),当用户尝试提交表单。
validation器似乎工作,因为如果我login数据控制台一切都如预期。 但是,当我渲染视图时,我无法在页面上显示错误(不显示任何内容)。 与我一直在进行快速validation的“标准”教程的唯一区别是,我使用AJAX发布数据。
我的代码如下。 我用[…]表示还有更多的代码被删除,为了简洁起见我省略了一些表单域。
app.js
var express = require('express') , indexController = require('./routes/index') , membersController = require('./routes/members') [...] , cookieParser = require('cookie-parser') , bodyParser = require('body-parser') , expressValidator = require('express-validator'); var app = express(); [...] app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); app.use(expressValidator()) // tried both placing it here or below app.use(cookieParser()); app.use(express.static(path.join(__dirname, 'public'))); // I realize this may be not optimal app.use(function(req,res,next){ req.db = db; next(); }); app.use('/', indexController); app.use('/members', membersController); [...] module.exports = app;
handle_members.js
$(document).ready(function() { $('#join_btn').click(function(event, req, res){ event.preventDefault(); var newMember = { 'name': $('#join_form input#join_name').val(), 'email': $('#join_form input#join_email').val() } $.ajax({ type: 'POST', data: newMember, url: '/members/addmember', dataType: 'JSON' }).done(function(response){ if (response.msg === 'success'){ alert('New member added successfully!') } // maybe this is not necessary? else if (response.msg === 'validation'){ alert('validation failed'); } else{ alert('Error: ' + response.msg) } }); }); });
members.js
var express = require('express'); var router = express.Router(); router.post('/addmember',validator, function(req, res) { var db = req.db; var collection = db.get('memberstest'); collection.insert(req.body, function(err, result){ res.send( (err === null) ? { msg: 'success' } : { msg: err } ); }); }); function validator(req, res, next) { req.checkBody('email', 'not valid email').isEmail(); req.checkBody('name', 'cannot be empty').notEmpty(); var errors = req.validationErrors(); if (errors) { console.log(errors) // these are as expected res.render('index',{errors:errors}); // no errors displayed } else { next(); } }; module.exports = router;
index.jade
[...] form#join_form(method='POST', action='', role='form') div.form-group input#join_name.form-control(type='text', name='join_name') input#join_email.form-control(type='email', name='email') button#join_btn.btn(type='button') join if errors ul for error in errors li = error.msg [...]
logging到控制台时的错误variables如下所示:
[ { param: 'email', msg: 'not valid email', value: 'xxxx' }, { param: 'name', msg: 'can't be empty', value: '' } ]
在过去的几天里,我尝试了很多不同的东西,但都没有成功。 问题似乎总是相同的:所有的好,但是当我渲染视图是像它从来没有进入“如果错误…”声明。 也许这里有一些非常基本的东西? 任何帮助非常感谢,谢谢。
PS。 最终forms理想情况下应该在一个模式/popup式,以防万一。
第一次尝试
尝试在任何bodyParser中间件之后立即添加validation器中间件,如文档要求:
var express = require('express') , indexController = require('./routes/index') , membersController = require('./routes/members') [...] , cookieParser = require('cookie-parser') , bodyParser = require('body-parser') , expressValidator = require('express-validator'); var app = express(); [...] app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); app.use(expressValidator()); // this line must be immediately after any of the bodyParser middlewares! app.use(cookieParser()); app.use(express.static(path.join(__dirname, 'public'))); // I realize this may be not optimal app.use(function(req,res,next){ req.db = db; next(); }); app.use('/', indexController); app.use('/members', membersController); [...] module.exports = app;
第二次尝试
基于文档,错误似乎是具有msg
和param
属性的对象数组。 尝试更新你的玉代码如下:
ul if errors each error, i in errors li #{error.msg}
第三次尝试
在分析了OP通过Github提供的代码之后,我发现了这个问题。 OP使用Ajax调用将数据发送到后端,并使用res.render进行响应,这显然是错误的,因为res.render
不会响应使用Ajax所做的请求,所以正确的方法是res。 json 。
例:
使用jQuery调用/addmember
端点:
var data = {}; // data here $.ajax({ type: 'POST', data: data, url: '/addmember', dataType: 'JSON' }).done(function() { alert('done'); }).fail(function() { alert('fail'); });
使用res.json
从后端回答:
router.post('/addmember', (req, res) => { var db = req.db; var collection = db.get('memberstest'); collection.insert(req.body, (error, result) => { if (error) return res.json({ error }); return res.json({ result }); }); });