前后台校验示例及讲解
来源:互联网 发布:linux将目录打包 编辑:程序博客网 时间:2024/05/11 20:07
在开发Java Web程序时,前后校验逻辑应该是必不可少的一部分。其中,前台校验更多地是从用户体验的角度出发,而后台校验更多地是从数据安全的角度出发。本博文基于Spring MVC写了一个前台后台结合校验的示例,不过没有使用Spring MVC自带的校验框架。示例前台使用Jquery Validation进行校验,后台使用Hibernate Validation进行校验,所以示例所需要的校验逻辑并不依赖于Spring MVC,只要引入相应的校验包,即可在任何Java Web环境中实现校验功能。(使用Spring MVC自带校验逻辑进行校验,改天有空再写个示例)
如果Jquery Validation使用不熟悉的话,可以查看我的Jquery Validation实用示例及讲解
如果Hibernate Validation使用不熟悉的话,可以查看我的Hibernate Validation使用示例及讲解
下面直接上示例代码:
一、主要依赖
jquery.validate.js
<dependency><groupId>org.hibernate</groupId><artifactId>hibernate-validator</artifactId><version>5.1.3.Final</version></dependency>
二、后台Controller类
该类只是模拟注册功能,并有一个用户名是否存在判断逻辑,主要是为了体现前后台校验的用法,所以没写其它逻辑,实际情况肯定比这复杂得多。
/** * 注册控制器 * @author wdmcygah * */@Controller@RequestMapping("/register")public class RegisterController {/** * 注册页面展示 */@RequestMapping("/show")public String register(){return "/register/show";}/** * 注册方法(主要为了演示使用Hibernate validation进行校验) */@RequestMapping(value="/create",method=RequestMethod.POST)public String doRegister(RegisterInfo info,Model model){//1、进行参数校验(这里省略名字重复校验,只演示相关用法)ValidationResult result = ValidationUtils.validateEntity(info);if( result.isHasErrors() ){model.addAttribute("errorMsg", result.getErrorMsg());return "/register/show";}//2、注册逻辑——省略model.addAttribute("successFlag", "1");return "/register/show";}/** * 判断用户名是否存在 * 详细描述: * 1、这里只作简单的演示,若名称以y开头则返回不存在。实际运用中可能是查询数据库 * 2、注意这里用到@ResponseBody注解,表示返回值不是视图名,直接将返回值绑定到response body中 * @param name * @return */@RequestMapping(value="isNameExists",method=RequestMethod.POST)@ResponseBodypublic String isNameExists( String name ){if( StringUtils.isEmpty(name) ){return "false";}//只有以'y'开头的名字才是不存在的if( name.startsWith("y") ){return "true";}return "false";}}
三、后台校验工具类
该类对Hibernate Validation方法进行了简单封装,实现校验实体对象的功能,返回是自定义的校验对象。
/** * 校验工具类 * @author wdmcygah * */public class ValidationUtils {private static Validator validator = Validation.buildDefaultValidatorFactory().getValidator();public static <T> ValidationResult validateEntity(T obj){ValidationResult result = new ValidationResult(); Set<ConstraintViolation<T>> set = validator.validate(obj,Default.class); if( CollectionUtils.isNotEmpty(set) ){ result.setHasErrors(true); Map<String,String> errorMsg = new HashMap<String,String>(); for(ConstraintViolation<T> cv : set){ errorMsg.put(cv.getPropertyPath().toString(), cv.getMessage()); } result.setErrorMsg(errorMsg); } return result;}}
四、后台校验结果类
/** * 校验结果 * @author wdmcygah * */public class ValidationResult {//校验结果是否有错private boolean hasErrors;//校验错误信息private Map<String,String> errorMsg;public boolean isHasErrors() {return hasErrors;}public void setHasErrors(boolean hasErrors) {this.hasErrors = hasErrors;}public Map<String, String> getErrorMsg() {return errorMsg;}public void setErrorMsg(Map<String, String> errorMsg) {this.errorMsg = errorMsg;}@Overridepublic String toString() {return "ValidationResult [hasErrors=" + hasErrors + ", errorMsg="+ errorMsg + "]";}}
五、后台被校验对象
/** * 注册信息 * @author wdmcygah * */public class RegisterInfo {@NotBlank(message="名字不能为空或者空串")private String name;@NotBlank(message="密码不能为空或者空串")@Pattern(regexp="(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{5,10}",message="密码必须是5~10位数字和字母的组合")private String password;@NotBlank(message="邮箱不能为空或者空串")@Email(message="邮箱格式不正确")private String email;public String getName() {return name;}public void setName(String name) {this.name = name;}public String getPassword() {return password;}public void setPassword(String password) {this.password = password;}public String getEmail() {return email;}public void setEmail(String email) {this.email = email;}}
六、前台注册页面
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%><!DOCTYPE html><html lang="zh-cn"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><!-- Bootstrap --><link href="<%=request.getContextPath()%>/statics/css/bootstrap.min.css"rel="stylesheet"><!-- 这里引入的是校验提示的样式 --><link href="<%=request.getContextPath()%>/statics/css/valid.css"rel="stylesheet"></head><body><div class="container"><form action="create.htm" method="post" id="registerForm"class="form-horizontal" role="form"><fieldset class="text-center"><legend> 前后台校验功能测试页面 </legend><c:choose><c:when test="${successFlag=='1'}">注册成功!<button type="button" class="btn btn-primary btn-large"onclick="window.location.href='show.htm' ">返回</button></c:when><c:otherwise><div class="form-group"><label class="col-sm-4 control-label" for="name">姓名</label><div class="col-sm-4"><input type="text" class="form-control" name="name" id="name"></div><label class="error" for="name">${errorMsg.name}</label></div><div class="form-group"><label class="col-sm-4 control-label" for="password">密码</label><div class="col-sm-4"><input type="password" class="form-control" name="password"id="password"></div><label class="error" for="password">${errorMsg.password}</label></div><div class="form-group"><label class="col-sm-4 control-label" for="email">电子邮箱</label><div class="col-sm-4"><input type="text" class="form-control" name="email" id="email"></div><label class="error" for="email">${errorMsg.email}</label></div><div class="form-actions "><button type="submit" class="btn btn-primary btn-large">提交</button><button type="reset" class="btn">取消</button></div></c:otherwise></c:choose></fieldset></form></div><!-- js --><scriptsrc="<%=request.getContextPath()%>/statics/js/import/jquery-1.11.1.js"></script><scriptsrc="<%=request.getContextPath()%>/statics/js/import/jquery.validate.js"></script><scriptsrc="<%=request.getContextPath()%>/statics/js/import/bootstrap.min.js"></script><!-- 这里引入的是校验提示信息的JS文件 --><scriptsrc="<%=request.getContextPath()%>/statics/js/import/messages_zh.js"></script><!-- 这里引入的是表单校验的JS文件 --><scriptsrc="<%=request.getContextPath()%>/statics/js/my/register_validation.js"></script><!-- 这里引入的是扩展Jquery validation的自定义JS文件 --><scriptsrc="<%=request.getContextPath()%>/statics/js/my/additional-methods.js"></script></body></html>
七、前台校验JS
这里主要介绍下validate方法中的remote,后面跟的是一个ajax请求,判断名字是否存在,后台只用返回“true”或者“false”,表示校验是否通过就行了。这个在表单异步校验的时候非常实用。
$(function() {$('#registerForm').validate({rules : {name : {required : true,remote : {url : "isNameExists.htm", //后台处理程序type : "post", //数据发送方式data : { //要传递的数据name : function() {return $("#name").val();}}}},password : {required : true,},email : {required : true,email : true}},messages:{name:{remote:"名字已经存在"}},success : "valid",errorClass : "error",errorPlacement : function(error, element) {error.appendTo(element.parent().parent());}});});
这里限于篇幅,只展示了主要逻辑代码,若想查看完整源码,可以查看我的Github仓库:https://github.com/wdmcygah/research-spring。其中仓库里面有些与本博文不相关的代码,注意区分。
代码在JDK1.8、chrome浏览器下测试通过。测试访问地址:http://localhost:8080/spring/register/show.htm,如果想完全地测试后台校验,需要把文中的JS校验方法注释掉,或者把浏览器的JS禁用。
- 前后台校验示例及讲解
- MVC学习系列-前后台数据校验
- Ext.Net前后台方法调用示例
- excl 导出示例代码 前后台
- javaweb上传文件前后台代码示例
- bootstrap-paginator分页-前后台用法示例
- asp.net MVC学习系列-前后台数据校验
- asp.net前后台校验缺一可否
- yii 前后台分离及登陆验证
- yii 前后台分离及登陆验证
- JNI示例及讲解
- web工程前后台验证(后台合法性校验和页面元素校验)统一处理
- Linux 前后台作业切换及脱机管理
- ASP.NET服务器推送及前后台实时交互
- Linux前后台作业切换及脱机管理
- IOS的生命周期及应用的前后台切换
- Android:监听应用前后台切换及思考
- Android:监听应用前后台切换及思考
- SpringMVC下打包文件的下载
- 多线程之生产者消费者模型
- 51nod 1394 差和问题(算法马拉松8)
- Jquery Validation实用示例及讲解
- Hibernate Validation使用示例及讲解
- 前后台校验示例及讲解
- Cookie的使用讲解及示例
- Mybatis实用Mapper SQL汇总示例
- C++primer plus第六版课后编程练习答案10.5
- windows server 2003 DHCP服务迁移到server2008
- 十二、编写高质量的代码——思想为源(笔记)
- Mybatis Oracle 批量插入数据的方法
- 十一、编写高质量的代码—开源世界(笔记)
- 任意数组的输入