黑马旅游网编写练习(1)--注册功能

黑马旅游网编写练习

黑马旅游网是包含学习完java-web的一个综合项目；项目中既包含前端，也包含后端的逻辑处理。项目使用三级结构，并未使用框架技术。

本次项目使用maven管理。练习使用一些编写好的前端资源文件；将其放置在本次项目中的src/main/webapp文件下；且还有一些工具类文件，放置在src/main/java/cn/itcast/travel/util文件夹下；在数据库中的实体类放置在src/main/java/cn/itcast/travel/domain文件夹下。

• 项目技术分析

  • web层
    1. Servlet ：前端逻辑控制器
    2. html ：前端视图
    3. Filter ：过滤器，封装Servlet通用的操作，如字符编码
    4. BeanUtils：数据封装的工具类
    5. Jackson ：json序列化的工具
  • service层
    1. Redis :内存缓存服务
    2. Jedis ：Java操作redis的工具
    3. javamail ：Java发送邮件的工具
  • dao层
    1. MySQL ：数据库
    2. Druid ：数据库连接池
    3. JdbcTemplate：jdbc工具

• 创建数据库
  在开始编写之前，首先打开数据库，创建一个travel数据库；然后使用该数据库，复制已经提供好的sql语句，并运行。

• 导入maven项目
  首先将已经提供好的预项目导入到maven中。在maven配置文件pom.xml中已经配置了tomcat，所以我们启动项目的方法是：1.启动maven项目右边plugins中的tomcat7:run命令；2.在项目中添加一个maven配置，设置命令启动命令tomcat7:run，并设置一个名字，此处我设置为tomcat7。之后便可以通过快捷按钮进行启动了。
  项目的结构如图所示
  
  接下来便开始项目具体功能的编写

1.注册功能
分析

1. 启动项目，然后打开网页中的注册界面，可以看到一个注册的表单；上面包含了用户名，密码，Email等多项待填的信息。
2. 在用户注册时，一般要动态完成用户填入信息的校验，若信息不合格，则对用户给出提示；所以要完成这一信息校验功能；可以使用Ajax异步请求技术，当用户填写完毕一项信息，则向web层发送一个异步请求，由Servlet来进行校验；也可以在前端使用正则表达式来进行信息的校验。此处用户名的校验需要用到数据库，所以使用Ajax技术来完成，而其他的信息只需要校验格式，所以选择在前端使用正则表达式来完成，以减小服务器的开支。
3. 用户点击注册按钮时，若信息校验均合格，则允许提交表单；否则，不做提交。若用户信息提交成功，则web层的servlet调用service层，service层调用dao层完成用户信息的保存工作。并对注册成功情况给出页面提示。

实现步骤总览

1. 用户名校验
2. 前端其他信息的校验
3. 注册成功的实现

1.1. 用户名校验

首先是前端的处理，使用JQuery来实现；首先获取用户名输入框，为其添加失去焦点事件，然后向后端发送Ajax请求，接收json数据相应；前端主要代码为：

    $(function () {
   
		/*
			用户名校验
			当用户名失去焦点后Ajax异步发送给FindUserServlet
		 */
		// 为用户名添加失去焦点事件
        $("#username").blur(function () {
   
            // 获取用户名
            var name = $(this).val();

            // 异步发送给findUserServlet
            $.get("findUserServlet",{
   username:name},function(data){
   
                // 处理服务端返回的数据
				// 该用户名存在		{"flag":true,"data":null,"errorMsg":"The username has been Used!"}
				// 该用户名不存在	{"flag":false,"data":null,"errorMsg":null}

				if(data.flag){
   
				    // 该用户名存在，将用户名边框变红，给出提示信息
					$("#username").css("border","1px solid red");
					$("#errorMsg").html("该用户名已被使用，请勿重复使用！");
				}else{
   
                    // 该用户名不存在，恢复边框颜色
                    $("#username").css("border","");
				}

            },"json");
        });
    });

后端使用了三层架构，web层主要代码为：

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
   
        //request.setCharacterEncoding("utf-8");
        //获取用户名
        String username = request.getParameter("username");
        System.out.println(username);
        //调用service层的方法检验用户名是否存在
        FindUserService service = new FindUserServiceImpl();
        Boolean isExist = service.findUserByName(username);
        ResultInfo info = new ResultInfo(); //封装返回信息的类
        //判断是否存在，封装到json数据中
        if (isExist){
   
            // 用户名已被使用
            info.setFlag(true);
            info.setErrorMsg("The username has been Used!");

        }else {
   
            // 用户名未被使用
            info.setFlag(false);
        }

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

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

    }

servlet层主要代码为：

    //创建dao对象
    private FindUserDao dao = new FindUserDaoImpl();

    /**
     * 通过用户名查询数据库，若不存在，返回false；若存在，则返回true
     * @param username
     * @return
     */
    @Override
    public Boolean findUserByName(String username) {
   

        User user = dao.findUser(username);

        if(user != null){
   
            // 该用户名已被使用，不能再被使用
            System.out.println("The username has been Used!");
            return true;
        }else{
   
            // 该用户不存在，可以使用该用户名
            System.ou