验证码和前台数据处理结果

验证码和前台数据处理结果

RegistUserServlet类：

package cn.itcast.travel.web.servlet;

import cn.itcast.travel.domain.ResultInfo;
import cn.itcast.travel.domain.User;
import cn.itcast.travel.service.UserService;
import cn.itcast.travel.service.impl.UserServiceImpl;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.apache.commons.beanutils.BeanUtils;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.lang.reflect.InvocationTargetException;
import java.util.Map;

@WebServlet("/registUserServlet")
public class RegistUserServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {


        //验证校验
        String check = request.getParameter("check");
        //从sesion中获取验证码
        HttpSession session = request.getSession();
        String checkcode_server = (String) session.getAttribute("CHECKCODE_SERVER");// 获取验证码 程序猿生成的验证码
        session.removeAttribute("CHECKCODE_SERVER");//移除验证码，为了保证验证码只能使用一次

        //比较
        if(checkcode_server == null || !checkcode_server.equalsIgnoreCase(check)){
            //验证码错误
            ResultInfo info = new ResultInfo();
            //注册失败
            info.setFlag(false);
            info.setErrorMsg("验证码错误");

            //将info对象序列化为json
            ObjectMapper mapper = new ObjectMapper();
            String json = mapper.writeValueAsString(info);
            response.setContentType("application/json;charset=utf-8");
            response.getWriter().write(json);
            return;
        }

        //1.获取数据
        Map<String, String[]> map = request.getParameterMap();

        //2.封装对象
        User user = new User();
        try {
            BeanUtils.populate(user,map);
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        } catch (InvocationTargetException e) {
            e.printStackTrace();
        }

        //3.调用service完成注册
        UserService service = new UserServiceImpl();
        boolean flag = service.regist(user);
        ResultInfo info = new ResultInfo();
        //4.响应结果
        if(flag){
            //注册成功
            info.setFlag(true);
        }else{
            //注册失败
            info.setFlag(false);
            info.setErrorMsg("注册失败!");
        }

        //将info对象序列化为json
        ObjectMapper mapper = new ObjectMapper();
        String json = mapper.writeValueAsString(info);

        //将json数据写回客户端
        //设置content-type
        response.setContentType("application/json;charset=utf-8");// json类型数据
        response.getWriter().write(json);


    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
    }
}

 

register.html页面：

            <script>
                /*
                    表单校验：
                        1.用户名：单词字符，长度8到20位
                        2.密码：单词字符，长度8到20位
                        3.email：邮件格式
                        4.姓名：非空
                        5.手机号：手机号格式
                        6.出生日期：非空
                        7.验证码：非空
                 */

                //校验用户名
                //单词字符，长度8到20位
                function checkUsername() {
                    //1.获取用户名值
                    var username = $("#username").val();
                    //2.定义正则
                    var reg_username = /^\w{8,20}$/;

                    //3.判断，给出提示信息
                    var flag = reg_username.test(username);
                    if(flag){
                        //用户名合法
                        $("#username").css("border","");
                    }else{
                        //用户名非法,加一个红色边框
                        $("#username").css("border","1px solid red");
                    }

                    return flag;
                }

                //校验密码
                function checkPassword() {
                    //1.获取密码值
                    var password = $("#password").val();
                    //2.定义正则
                    var reg_password = /^\w{8,20}$/;

                    //3.判断，给出提示信息
                    var flag = reg_password.test(password);
                    if(flag){
                        //密码合法
                        $("#password").css("border","");
                    }else{
                        //密码非法,加一个红色边框
                        $("#password").css("border","1px solid red");
                    }

                    return flag;
                }

                //校验邮箱
                function checkEmail(){
                    //1.获取邮箱
                    var email = $("#email").val();
                    //2.定义正则        itcast@163.com
                    var reg_email = /^\w+@\w+\.\w+$/;

                    //3.判断
                    var flag = reg_email.test(email);
                    if(flag){
                        $("#email").css("border","");
                    }else{
                        $("#email").css("border","1px solid red");
                    }

                    return flag;
                }

                $(function () {
                    //当表单提交时，调用所有的校验方法
                    $("#registerForm").submit(function(){
                        //1.发送数据到服务器
                        if(checkUsername() && checkPassword() && checkEmail()){
                            //校验通过,发送ajax请求，提交表单的数据   username=zhangsan&password=123

                            $.post("registUserServlet",$(this).serialize(),function(data){
                                //处理服务器响应的数据  data  {flag:true,errorMsg:"注册失败"}

                                if(data.flag){
                                    //注册成功，跳转成功页面
                                    location.href="register_ok.html";
                                }else{
                                    //注册失败,给errorMsg添加提示信息
                                    $("#errorMsg").html(data.errorMsg);
                                }
                            });

                        }
                        //2.不让页面跳转
                        return false;
                        //如果这个方法没有返回值，或者返回为true，则表单提交，如果返回为false，则表单不提交
                    });

                    //当某一个组件失去焦点是，调用对应的校验方法
                    $("#username").blur(checkUsername);
                    $("#password").blur(checkPassword);
                    $("#email").blur(checkEmail);
                });
            </script>